MessageChannel: port1 屬性

Baseline 已廣泛支援

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

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

MessageChannel 介面的 port1 只讀屬性返回訊息通道的第一個埠——附加到發起通道的上下文的埠。

值

一個 MessagePort 物件，它是通道的第一個埠，即附加到發起通道的上下文的埠。

在以下程式碼塊中，你可以看到使用 MessageChannel() 建構函式建立了一個新的通道。當 <iframe> 載入後，我們使用 MessagePort.postMessage 將 port2 和一條訊息傳遞給 <iframe>。然後 handleMessage 處理器響應從 <iframe> 發回的訊息（使用 onmessage），並將其放入一個段落中。handleMessage 方法與 port1 相關聯，以監聽訊息何時到達。

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;
}