該方法是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對象