Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from http://developer.mozilla.org/ja/docs/Web/API/ServiceWorkerContainer/message_event below:

ServiceWorkerContainer: message イベント - Web API

Baseline Widely available

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

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 オブジェクトの配列で、メッセージが送信されるチャンネルに関連するポートを表します（チャンネルメッセージングや、共有ワーカーにメッセージを送信する場合など、適切な場合）。

この例では、サービスワーカーは fetch イベントからクライアントの ID を取得し、Client.postMessage を使用してメッセージを送信します。

// サービスワーカー内
async function messageClient(clientId) {
  const client = await clients.get(clientId);
  client.postMessage("こんにちはクライアント！");
}

addEventListener("fetch", (event) => {
  messageClient(event.clientId);
  event.respondWith(() => {
    // …
  });
});

クライアントは message イベントを待ち受けしてメッセージを受信できます。

// main.js
navigator.serviceWorker.addEventListener("message", (message) => {
  console.log(message);
});

あるいは、クライアントは onmessage イベントハンドラーでメッセージを受信することもできます。

// main.js
navigator.serviceWorker.onmessage = (message) => {
  console.log(message);
};

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4