ドメイン間メッセージ転送window.postMessage()

1121 ワード

この方法は、HTML 5がドメイン間メッセージ伝送のためのAPIである
送信ウィンドウ
window.postMessage()メソッドが呼び出されると、すべてのページスクリプトが実行された後(e.g.このメソッドの後に設定されたイベント、前に設定されたtimeoutイベント、etc.)に、ターゲットウィンドウにMessage Eventメッセージが送信されます.Message Eventメッセージには4つの属性があります.message属性はmessageのタイプを表します.data属性はwindowです.postMessageの最初のパラメータ;origin属性はwindowを呼び出すことを表す.postMessage()メソッド時にページの現在の状態を呼び出す.sourceプロパティレコード呼び出しwindow.PostMessage()メソッドのウィンドウ情報.構文
otherWindow.postMessage(message, targetOrigin, [transfer]);
otherWindow:iframeのcontentWindow属性とwindowを含む、データを送信するウィンドウのwindowの参照を表す.Openが開いた新しいウィンドウ.Messageは、送信するデータ、パケット拡張文字列、オブジェクトを表します(ie 9以下はサポートされていません.文字列と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オブジェクト