How do you use window.postMessage across domains?

user_80572 0
Viewed 161211

It seems like the point of window.postMessage is to allow safe communication between windows/frames hosted on different domains, but it doesn't actually seem to allow that in Chrome.

Here's the scenario:

  1. Embed an <iframe> (with a src on domain B*) in a page on domain A
  2. The <iframe> ends up being mostly a <script> tag, at the end of which's execution...
  3. I call window.postMessage( some_data, page_on_A )

The <iframe> is most definitely in the context of domain B, and I've confirmed that the embedded javascript in that <iframe> executes properly and calls postMessage with the correct values.

I get this error message in Chrome:

Unable to post message to A. Recipient has origin B.

Here's the code that registers a message event listener in the page on A:

window.addEventListener(
  "message",
  function (event) {
    // Do something
  },
  false);

I've also tried calling window.postMessage(some_data, '*'), but all that does is suppress the error.

Am I just missing the point here, is window.postMessage(...) not meant for this? Or am I just doing it horribly wrong?

*Mime-type text/html, which it must remain.

google-chrome xss html javascript
3 Answers

You should post a message from frame to parent, after loaded.

frame script:

$(document).ready(function() {
    window.parent.postMessage("I'm loaded", "*");
});

And listen it in parent:

function listenMessage(msg) {
    alert(msg);
}

if (window.addEventListener) {
    window.addEventListener("message", listenMessage, false);
} else {
    window.attachEvent("onmessage", listenMessage);
}

Use this link for more info: http://en.wikipedia.org/wiki/Web_Messaging

user_27218790
Related