implement a callback between two sites - communicating between two sites

I have a web app in http://domain1/app1/called.html, and I want to embed that application inside http://domain2/app2/caller.html with an iframe (or a popup, it's the same)

the user should be able to interact with called.html, until they press a certain button, in that case I need to tell caller.html that the user selected an item from called.html

I tried implementing it with javascript.

in called.html I encode the data in json, and then I execute a "called_callback" javascript function in caller.html, passing the json as a parameter.

if called.html was called with a popup, I issue window.opener.called_callback( jsonData ), if it's an iframe I just issue parent.called_callback( jsonData )

having caller.html and called.html in the same domain everything works fine, but from different domains I get the following errors:

permission denied (on IE6)

and

Unsafe JavaScript attempt to access frame with URL [..]/caller.html from frame with URL [...]called.html. Domains, protocols and ports must match. (on goo开发者_JS百科gle chrome)

Is it possible to overcome this limitation?

What other way of achieving it can you think of???

I guess caller.html could implement a web service, and I could send the result calling it, but the page caller.html would have to poll in order to detect any change...

So how can one application communicate with another one in a different domain to signal an event???

You can use JSONP to call resources from one domain to another.

You can use window.name as ~2Mb text transfer between cross domain frames for older browser.

Or for modern browser you can use window.postMessage to communicate string data between the 2 frames.

But you need some cooperation from the domains for these techniques to work.

You should look into using JSONP. It is fully supported in jQuery if you are using that particular framework. It allows you to use JSON across domains.

Thanks to both answer I found the following:

http://benalman.com/code/projects/jquery-postmessage/docs/files/jquery-ba-postmessage-js.html

http://benalman.com/projects/jquery-postmessage-plugin/

jQuery postMessage enables simple and easy window.postMessage communication in browsers that support it (FF3, Safari 4, IE8), while falling back to a document.location.hash communication method for all other browsers (IE6, IE7, Opera).

With the addition of the window.postMessage method, JavaScript finally has a fantastic means for cross-domain frame communication. Unfortunately, this method isn’t supported in all browsers. One example where this plugin is useful is when a child Iframe needs to tell its parent that its contents have resized.

I'll have a look at it...

here's a very complete document that analizes the different approaches...

http://softwareas.com/cross-domain-communication-with-iframes

another solution to have a look at

http://easyxdm.net/

with a sample

http://easyxdm.net/wp/2010/03/17/setting-up-your-first-socket/