SharedWorkerGlobalScope: connect イベント

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

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

onconnect = (event) => {};

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

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

MessageEvent.data 読取専用

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

MessageEvent.origin 読取専用

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

MessageEvent.lastEventId 読取専用

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

MessageEvent.source 読取専用

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

MessageEvent.ports 読取専用

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

この例は共有ワーカーファイルを示しています。メインスレッドから MessagePort を通してワーカーへの接続が発生したとき、 onconnect イベントハンドラーが呼び出されます。イベントオブジェクトは MessageEvent です。

接続しようとしているポート番号は、イベントオブジェクトの ports 引数で参照することができます。この参照にはポートを通じて来るメッセージを扱うために割り当てられた onmessage ハンドラーがあり、その postMessage() メソッドにワーカーを使用してメインスレッドにメッセージを送り返すために使用することができます。

self.onconnect = (e) => {
  const port = e.ports[0];

  port.onmessage = (e) => {
    const workerResult = `Result: ${e.data[0] * e.data[1]}`;
    port.postMessage(workerResult);
  };

  port.start();
};

実行している例を完成させるには、 Basic shared worker example (共有ワーカーを実行) をご覧ください。

addEventListener() メソッドを使用してイベントハンドラーを設定することもできます。

self.addEventListener("connect", (e) => {
  const port = e.ports[0];

  port.onmessage = (e) => {
    const workerResult = `Result: ${e.data[0] * e.data[1]}`;
    port.postMessage(workerResult);
  };
});

• ウェブワーカーの使用
• SharedWorkerGlobalScope