MessageChannel:port2 屬性

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 2015 年 9 月以來,該特性已在各大瀏覽器中可用。

注意:此功能在 Web Workers 中可用。

port2MessageChannel 介面的只讀屬性,它返回訊息通道的第二個埠——連線到通道另一端上下文的埠,訊息最初發送到該埠。

一個 MessagePort 物件,表示通道的第二個埠,即連線到通道另一端上下文的埠。

示例

在以下程式碼塊中,你可以看到使用 MessageChannel() 建構函式建立了一個新的通道。當 IFrame 載入完成後,我們使用 Window.postMessage()port2 以及一條訊息傳遞給 IFrame。然後,handleMessage 處理器響應從 IFrame 發回的訊息(使用 onmessage),將其放入一個段落中。port1 被監聽以檢查訊息何時到達。

js
const channel = new MessageChannel();
const para = document.querySelector("p");

const ifr = document.querySelector("iframe");
const otherWindow = ifr.contentWindow;

ifr.addEventListener("load", iframeLoaded);

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

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

有關完整的工作示例,請參閱 GitHub 上的 通道訊息傳遞基本演示也可以線上執行)。

規範

規範
HTML
# dom-messagechannel-port2-dev

瀏覽器相容性

另見