DedicatedWorkerGlobalScope.postMessage()

Baseline Widely available

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

postMessage() は DedicatedWorkerGlobalScope インターフェイスのメソッドで、それを生成したメインスレッドにメッセージを送信します。

これは data 引数を受け入れ、そこにワーカーからメインスレッドにコピーされるデータが入ります。 data は任意の値、または構造化複製アルゴリズムで処理される JavaScript オブジェクトであり、循環参照を含むことができます。

このメソッドは、メインスレッドに移譲するための移譲可能オブジェクトの配列もオプションで受け入れます。 data 引数とは異なり、移譲されたオブジェクトはワーカスレッドでは使えなくなります（可能であれば、オブジェクトは高性能なゼロコピー処理で移譲されます）。

ワーカーを生成したメインスコープは、Worker.postMessage メソッドを使用して、ワーカーを生成したスレッドに情報を送り返すことができます。

構文

js
postMessage(aMessage, transferList)

引数

aMessage

メインスレッドに配信するオブジェクト。これは Worker.message_event に配信されるイベント内の data フィールドに格納されます。 これは、構造化複製アルゴリズムによって処理される任意の値または JavaScript オブジェクトであり、循環参照を含むことができます。

transferList 省略可

所有権を移譲するための、移譲可能オブジェクトの配列（オプション）。 オブジェクトの所有権が移譲された場合、そのオブジェクトは送信元のコンテキストでは使用できなくなり、 送信先のメインスレッドでのみ利用できるようになります。

移譲可能オブジェクトのみが移譲可能です。

返値

なし (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);
};

メインスクリプトでは onmessage を Worker オブジェクトに対して呼び出す必要がありますが、ワーカススクリプトの内部では onmessage だけで済みます。ワーカーは事実上グローバルスコープ (DedicatedWorkerGlobalScope) になっているためです。

完全な例は、基本的な専用ワーカーの例を参照してください（専用ワーカーを実行）。

メモ: postMessage() は一度に単一のオブジェクトしか送ることができません。上で見たように、複数の値を渡したい場合は、配列を送ることができます。

仕様書

Specification
HTML Standard
# dom-dedicatedworkerglobalscope-postmessage-dev

ブラウザーの互換性

BCD tables only load in the browser

関連情報

所属先の DedicatedWorkerGlobalScope インターフェイス。