标签：推荐 span back 浏览器 UNC list dde 表示 参数
跨文档消息传递：（cross-document message）
有时候简称XDM，指的是来自不同域的页面间传递消息；
XDM的核心是postMessage（）方法，目的是向另一个地方传递数据，对于XDM而言，另一个地方指的是包含值本页面的iframe元素，或则由当前页面弹出的窗口；
postMessage（）接收两个参数，一条消息和一个表示消息接收方来自哪个域的字符串，第二个参数对保障安全通讯非常重要，可以防止浏览器把消息发送到不安全的地方。
<body> <iframe id="iframe" src="http://www.tzding.com" height="300px" width="300px" scrolling="yes"></iframe> <script> var iframe=document.getElementById("iframe"); var iframeWindow=iframe.contentWindow; iframeWindow.postMessage("a secret","*");//来自任何域，不推荐 iframeWindow.postMessage("a secret","http://www.baidu.com");//来自百度 </script> </body>
接收XDM消息时，会触发window对象的message事件，是异步触发的，会有延迟，传递给message事件的事件对象包含三个重要信息：
data：作为postMessage（）第一个参数传入的字符串数据；
origin：发送消息的文档所在的域，例如："http://www.baidu.com"
source:发送消息的文档的window对象的代理。这个代理对象主要用于在发送上一条消息的窗口调用postMessage（）方法。如果发送消息的窗口来自同一个域，那这个对象就是window。
收到消息后验证发送窗口的来源是至关重要的，就像给postMessage（）方法指定第二个参数，以确保浏览器不会把消息发送给未知页面一样，在onmessage处理程序中检测消息来源可以确保传入的消息来自已知页面。基本验证模式如下：
window.addEventListener("window","message",function(event){
//确保发送消息的域是已知的域
if(event.origin=="http://www.baidu.com"){
//处理接收到的数据
console.log(event.data);
//可选：向来源窗口发送回执
event.source.postMessage("Received!","http://www.baidu.com")
}
})
postMessage（）方法的第一个参数必须是字符串，也可以传其它结构数据，调用JSON.stringify（），在onmessage事件处理程序中，用JSON.parse()
将json字符串转回成json格式；
不过iframe正在淡出前端开发，因为它有很多的缺点，不如ajax，了解一下；
标签：推荐 span back 浏览器 UNC list dde 表示 参数
原文地址：https://www.cnblogs.com/fqh123/p/10562035.html
