Cross domain issue with iframes

i'm not a fan of jsonp, it creates coupling between data and presentation, and so i researched this issue before, and well, there's a trick that you can use, follow this:

let's say we have the main window named A and the "child" window in the iframe named B. A and B must be served from the same host, but can have different subdomains, something like:

A is served from sub1.example.com

B is served from sub2.example.com

browsers will let you change the domain of the document, but still restrict you on that, so you can only change the domain by removing subdomains until you reach the host, and so in A you change the domain, like so:

document.domain = "example.com"; 

in B you first make an ajax call to its domain (sub2.example.com), then after the first request was sent you change the domain just like in A, so that both documents have the same domain. since you made a request to the original domain in B the browser will allow you to keep sending requests to it, but since you also changed its domain, and now A and B have the same domain they can communicate with each other.

it's important that you first make at least one request in B to its original domain, before you change the domain. also, it won't work if both pages are not served from the same host, so in most cases it does not solve the problem, but it does allow you a bit more room to maneuver.

i used this trick more than once and haven't came across any problems, as far as i'm aware, it works in all browsers, let me know if it doesn't in some cases.

here's a pseudo example:

in A ================== document.domain = "example.com"; var child; // keep reference to B function setChild(win) { childDocument = win; } function handleMessage(message) { do what ever it is you need to } in B ================== make ajax request document.domain = "example.com"; parent.setChild(this); function ajaxCallback(message) { parent.handleMessage(message); }