该方法是HTML5用于跨域消息传输的API
发送窗口
window.postMessage()方法被调用时,会在所有页面脚本执行完毕之后(e.g., 在该方法之后设置的事件、之前设置的timeout 事件,etc.)向目标窗口派发一个 MessageEvent消息。 该MessageEvent消息有四个属性需要注意:
message 属性表示该message 的类型;
data 属性为 window.postMessage的第一个参数;
origin 属性表示调用window.postMessage()方法时调用页面的当前状态;
source 属性记录调用window.postMessage()方法的窗口信息。
语法
otherWindow.postMessage(message, targetOrigin, [transfer]);
otherWindow:表示发送数据的窗口的window的引用,包括iframe的contentWindow属性和通过window.open打开的新窗口。
message表示要发送的数据,包扩字符串和对象(ie9以下不支持,可以利用字符串和json互换)。
origin表示接收窗口的域。
接收窗口
window.addEventListener("message", receiveMessage, false);
function receiveMessage(event)
{
// For Chrome, the origin property is in the event.originalEvent
// object.
var origin = event.origin || event.originalEvent.origin;
if (origin !== "http://example.org:8080")
return;
// ...
}
回调函数接受一个事件对象event, event包含属性
data:接受的数据
origin:发送窗口的域
source:发送端的DOMWindow对象