MessagePort.onmessage

MessagePort インターフェイスの onmessage イベントハンドラは、EventListener であり、ポート上で message 型の MessageEvent が発動した時に呼び出されます。つまり、ポートがメッセージを受信した時に呼び出されます。

注: この機能は Web Worker 内で利用可能です

構文

channel.onmessage = function() { ... };

次のコードブロックには、MessageChannel.MessageChannel コンストラクタで作成された新しいチャンネルがあります。IFrame が読み込まれた時、MessagePort.postMessage を使用してメッセージと MessageChannel.port2 が IFrame へ渡されます。すると、handleMessage ハンドラが onmessage によって IFrame から返されたメッセージに応答し、そのメッセージを段落に出力します。ここで、MessageChannel.port1 は、メッセージが到着したときに確認するための待機状態にあります。

var channel = new MessageChannel();
var para = document.querySelector('p');

var ifr = document.querySelector('iframe');
var otherWindow = ifr.contentWindow;

ifr.addEventListener("load", iframeLoaded, false);

function iframeLoaded() {
  otherWindow.postMessage('Hello from the main page!', '*', [channel.port2]);
}

channel.port1.onmessage = handleMessage;
function handleMessage(e) {
  para.innerHTML = e.data;
}

完全に動作する例は、Github 上のチャンネルメッセージ送信の基本デモを見てください (実際の動作も確認できます)。

仕様

仕様書	策定状況	備考
HTML Living Standard onmessage の定義	現行の標準	Unknown との差異なし。
Unknown onmessage の定義	不明	仕様の W3C バージョン。

ブラウザの実装状況

BCD tables only load in the browser

MessagePort.onmessage

構文

例

仕様

ブラウザの実装状況

関連情報