DedicatedWorkerGlobalScope: postMessage() 方法

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

注意:此功能僅在 專用 Web Worker 中可用。

DedicatedWorkerGlobalScope 介面的 postMessage() 方法將訊息傳送給建立它的主執行緒。

此方法接受一個 data 引數,該引數包含要從 worker 複製到主執行緒的資料。資料可以是 結構化克隆 演算法處理的任何值或 JavaScript 物件,包括迴圈引用。

該方法還接受一個可選的 可轉移物件 陣列,用於轉移到主執行緒;與資料引數不同,轉移的物件在 worker 執行緒中不再可用。(如果可能,物件使用高效能的零複製操作進行轉移)。

建立 worker 的主作用域可以使用 Worker.postMessage 方法將資訊傳送回建立它的執行緒。

語法

js
postMessage(message)
postMessage(message, transfer)
postMessage(message, options)

引數

message

要傳遞給主執行緒的物件;這將在傳遞給 message 事件的資料欄位中。這可以是 結構化克隆 演算法處理的任何值或 JavaScript 物件,包括迴圈引用。

transfer 可選

一個可選的可傳輸物件陣列,用於轉移所有權。這些物件的所有權將轉移到目標方,並且它們在傳送方不再可用。這些可傳輸物件應該附加到訊息中;否則它們將被移動,但在接收端實際上無法訪問。

options 可選

一個包含以下屬性的可選物件

transfer 可選

transfer 引數具有相同的含義。

返回值

無(undefined)。

示例

以下程式碼片段展示了 worker.js,其中使用 onmessage 處理程式來處理來自主指令碼的訊息。在處理程式內部,會進行計算,然後建立結果訊息;該訊息隨後使用 postMessage(workerResult); 傳送回主執行緒。

js
onmessage = (e) => {
  console.log("Message received from main script");
  const workerResult = `Result: ${e.data[0] * e.data[1]}`;
  console.log("Posting message back to main script");
  postMessage(workerResult);
};

在主指令碼中,必須在 Worker 物件上呼叫 onmessage,而在 worker 指令碼中,你只需要 onmessage,因為 worker 實際上就是全域性作用域(DedicatedWorkerGlobalScope)。

如需完整示例,請參閱我們的 基本專用 Worker 示例執行專用 Worker)。

注意: postMessage() 一次只能傳送一個物件。如上所示,如果要傳遞多個值,可以傳送一個數組。

規範

規範
HTML
# dom-dedicatedworkerglobalscope-postmessage-dev

瀏覽器相容性

另見

它所屬的 DedicatedWorkerGlobalScope 介面。