你如何跨域使用window.postMessage?

看起来window.postMessage的要点是允许在不同域上托管的窗口/框架之间进行安全通信,但实际上Chrome并没有允许这样做。

以下是该场景:

  • 在域A的页面中嵌入<iframe>(在域B *上带有src
  • <iframe>最终是一个<script>标签,在其结束时执行...
  • 我打电话给window.postMessage(some_data,page_on_A)
  • <iframe>绝对是在域B的上下文中,并且我已经确认在<iframe>中嵌入的javascript可以正确执行并使用正确的值调用postMessage

    我在Chrome中收到此错误消息:

    无法发送消息给A.收件人有源B.

    以下是在A上的页面中注册消息事件侦听器的代码:

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

    我也尝试调用window.postMessage(some_data, '*') ,但是所有这些都会抑制错误。

    我只是在这里忽略了一点,是window.postMessage(...)不是为了这个吗? 或者我只是在做可怕的错误?

    * Mime类型的文本/ HTML,它必须保留。


    这是一个适用于Chrome 5.0.375.125的示例。

    页面B(iframe内容):

    <html>
        <head></head>
        <body>
            <script>
                top.postMessage('hello', 'A');
            </script>
        </body>
    </html>
    

    注意在这里使用top.postMessageparent.postMessage而不是window.postMessage

    页面A:

    <html>
    <head></head>
    <body>
        <iframe src="B"></iframe>
        <script>
            window.addEventListener( "message",
              function (e) {
                    if(e.origin !== 'B'){ return; } 
                    alert(e.data);
              },
              false);
        </script>
    </body>
    </html>
    

    A和B必须是http://domain.com

    编辑:

    从另一个问题看,域名(A和B在这里)必须有一个/ for postMessage才能正常工作。


    加载后,您应该将消息从框架发布到父级。

    框架脚本:

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

    并在家长中倾听:

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

    使用此链接获取更多信息:http://en.wikipedia.org/wiki/Web_Messaging


    可能您尝试将您的数据从mydomain.com发送到www.mydomain.com或反向发送,请注意您错过了“www”。 http://mydomain.com和http://www.mydomain.com是javascript的不同域。

    链接地址: http://www.djcxy.com/p/22549.html

    上一篇: How do you use window.postMessage across domains?

    下一篇: Get Portion of URL Path