MessageChannel.port1

port1MessageChannel インターフェースの読み取り専用プロパティで、メッセージチャンネルの最初のポートを返します。このポートは、チャンネルの元となるコンテキストに付属します。

註: この機能は Web Workers 内で利用可能です。

構文

channel.port1;

チャンネルの最初のポートを表す MessagePort オブジェクト。これはチャンネルの元となるコンテキストに付属するポートです。

次のコードブロックでは、 MessageChannel() コンストラクターを使用して作成された新しいチャンネルが見られます。 <iframe> が読み込まれると、 MessageChannel.port2<iframe> へ、メッセージを通して MessagePort.postMessage を使用して渡します。すると、 handleMessage ハンドラーが <iframe> から返送されたメッセージに (MessagePort.onmessage を使用して) 返答し、これを段落に挿入します。メッセージが到着したとき、 handleMessage メソッドが 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;
}

仕様書

仕様 状態 備考
HTML Living Standard
port1 の定義
現行の標準  

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
port1Chrome 完全対応 4Edge 完全対応 ありFirefox 完全対応 41IE 完全対応 10Opera 完全対応 10.6Safari 完全対応 5WebView Android 完全対応 4.4Chrome Android 完全対応 18Firefox Android 完全対応 41Opera Android 完全対応 11Safari iOS 完全対応 5.1Samsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応

関連情報