Worker: message イベント

このイベント名を addEventListener() などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。

addEventListener("message", (event) => {});

onmessage = (event) => {};

MessageEvent です。 Event を継承しています。

このインターフェイスには、親である Event から継承したプロパティもあります。

MessageEvent.data 読取専用

メッセージ送信者から送信されたデータです。

MessageEvent.origin 読取専用

文字列で、メッセージ送信者のオリジンを表します。

MessageEvent.lastEventId 読取専用

文字列で、このイベントの固有の ID を表します。

MessageEvent.source 読取専用

MessageEventSource （WindowProxy, MessagePort, ServiceWorker の何れかのオブジェクトがなれる）で、メッセージ送信者を表します。

MessageEvent.ports 読取専用

MessagePort オブジェクトの配列で、メッセージが送信されるチャネルに関連するポートを表します（チャネルメッセージングや共有ワーカーにメッセージを送信する場合など、必要に応じて）。

このコードでは、新しいワーカーを生成して、 addEventListener() を用いてメッセージを待ち受けします。

const worker = new Worker("static/scripts/worker.js");

worker.addEventListener("message", (event) => {
  console.log(`Received message from worker: ${event.data}`);
});

他にも、 onmessage イベントハンドラープロパティを使用して待ち受けすることもできます。

const worker = new Worker("static/scripts/worker.js");

worker.onmessage = (event) => {
  console.log(`Received message from worker: ${event.data}`);
};

ワーカーは self.postMessage() を使用してメッセージを送信します。

// static/scripts/worker.js

self.postMessage("I'm alive!");

• 関連イベント: messageerror.
• DedicatedWorkerGlobalScope.postMessage().