Channel Messaging API

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年9月.

備註： 此功能可在 Web Worker 中使用。

Channel Messaging API 允許兩個分別運行於不同瀏覽上下文且附加至同一文件的腳本（例如，兩個 IFrame，或主文件與一個 IFrame，兩個透過 SharedWorker 的文件，或兩個 worker）直接進行通訊，透過雙向通道（或管道）在兩端的埠之間傳遞訊息。

概念與使用方式

可以使用 MessageChannel() 建構子來建立一個訊息通道。一旦建立後，通道的兩個埠可以透過 MessageChannel.port1 和 MessageChannel.port2 屬性存取（這兩者都會回傳 MessagePort 物件）。建立通道的應用程式使用 port1，而另一端的應用程式使用 port2——你可以向 port2 發送訊息，並使用 window.postMessage 傳遞兩個參數（要發送的訊息以及要轉移所有權的物件，在此情況下為埠本身）將埠轉移到另一個瀏覽上下文。

當這些可轉移物件被轉移後，它們在先前所屬的上下文中將無法再使用。例如一個埠，一旦被傳送，在原本的上下文中將無法再使用。

另一個瀏覽上下文可以使用 onmessage 監聽訊息，並透過事件的 data 屬性抓取訊息的內容。然後，你可以使用 MessagePort.postMessage 回應，將訊息傳回原始文件。

當你想停止透過通道傳送訊息時，可以調用 MessagePort.close 關閉埠。

在使用通道訊息中了解更多有關如何使用此 API 的資訊。