为了账号安全,请及时绑定邮箱和手机立即绑定

您如何跨域使用window.postMessage?

/ 猿问

您如何跨域使用window.postMessage?

绝地无双 2019-11-11 15:37:34

似乎window.postMessage的重点是允许在不同域中托管的Windows /框架之间进行安全通信,但实际上似乎不允许在Chrome中进行通信。


这是场景:


在域A的页面中嵌入<iframe>(具有src域B *)

<iframe>最终主要是一个<script>标记,在执行结束时...

我叫window.postMessage(some_data,page_on_A)

<iframe>绝对是在域B的上下文中,并且我已经确认<iframe>中的嵌入式javascript可以正确执行并postMessage使用正确的值进行调用。


我在Chrome中收到以下错误消息:


无法发布消息到一个。收件人有产地乙。


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


window.addEventListener(

  "message",

  function (event) {

    // Do something

  },

  false);

我也尝试过致电window.postMessage(some_data, '*'),但所有要做的就是抑制错误。


我只是在这里遗漏了一点,是不是window.postMessage(...)并非要这样做吗?还是我只是做错了什么?


* MIME类型的text / html,必须保留。


查看完整描述

3 回答

?
慕圣8478803

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


网页B(iframe内容):


<html>

    <head></head>

    <body>

        <script>

            top.postMessage('hello', 'A');

        </script>

    </body>

</html>

注意使用top.postMessage或parent.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)必须具有a postMessage才能正常工作。


查看完整回答
反对 回复 2019-11-11
?
精慕HU

加载后,您应该从框架向父发布一条消息。


框架脚本:


$(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


查看完整回答
反对 回复 2019-11-11
?
慕的地2183247

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


查看完整回答
反对 回复 2019-11-11

添加回答

回复

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信