From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/api/extendablemessageevent/index.html | 108 +++++++++++++++++++++ 1 file changed, 108 insertions(+) create mode 100644 files/ja/web/api/extendablemessageevent/index.html (limited to 'files/ja/web/api/extendablemessageevent/index.html') diff --git a/files/ja/web/api/extendablemessageevent/index.html b/files/ja/web/api/extendablemessageevent/index.html new file mode 100644 index 0000000000..f42b886fe8 --- /dev/null +++ b/files/ja/web/api/extendablemessageevent/index.html @@ -0,0 +1,108 @@ +--- +title: ExtendableMessageEvent +slug: Web/API/ExtendableMessageEvent +tags: + - API + - ExtendableMessageEvent + - Interface + - Reference + - Service Workers +translation_of: Web/API/ExtendableMessageEvent +--- +
{{APIRef("Service Workers API")}}
+ +

Service Worker API の ExtendableMessageEvent インターフェイスは、（別のコンテキストからのメッセージを {{domxref("ServiceWorkerGlobalScope")}} で受信した時に）サービスワーカーで発生する {{event("message_(ServiceWorker)","message")}} イベントのイベントオブジェクトを表し、このようなイベントの存続期間を延長します。

+ +

このインターフェイスは、{{domxref("ExtendableEvent")}} インターフェイスを継承しています。

+ +

コンストラクター

+ +
+
{{domxref("ExtendableMessageEvent.ExtendableMessageEvent","ExtendableMessageEvent()")}}
+
新しい ExtendableMessageEvent オブジェクトのインスタンスを作成します。
+
+ +

プロパティ

+ +

親の {{domxref("ExtendableEvent")}} からプロパティを継承します。

+ +
+
{{domxref("ExtendableMessageEvent.data")}} {{readonlyinline}}
+
イベントのデータを返します。 任意のデータ型を使用できます。
+
{{domxref("ExtendableMessageEvent.origin")}} {{readonlyinline}}
+
メッセージを送信した {{domxref("Client")}} のオリジンを返します。
+
{{domxref("ExtendableMessageEvent.lastEventId")}} {{readonlyinline}}
+
サーバー送信イベント（server-sent events）で、イベントソースの最後のイベント ID を表します。 これは空の文字列です。
+
{{domxref("ExtendableMessageEvent.source")}} {{readonlyinline}}
+
メッセージを送信した {{domxref("Client")}} オブジェクトへの参照を返します。
+
{{domxref("ExtendableMessageEvent.ports")}} {{readonlyinline}}
+
関連するメッセージチャンネルのポートを表す {{domxref("MessagePort")}} オブジェクトを含む配列を返します。
+
+ +

メソッド

+ +

親の {{domxref("ExtendableEvent")}} からメソッドを継承します。

+ +

例

+ +

以下の例では、ページが {{domxref("ServiceWorkerRegistration.active")}} を介して {{domxref("ServiceWorker")}} オブジェクトへのハンドルを取得し、その postMessage() 関数を呼び出します。

+ +
// 制御されているページ内
+if (navigator.serviceWorker) {
+
+  navigator.serviceWorker.register('service-worker.js');
+
+  navigator.serviceWorker.addEventListener('message', event => {
+    // event は MessageEvent オブジェクトです
+    console.log(`The service worker sent me a message: ${event.data}`);
+  });
+
+  navigator.serviceWorker.ready.then( registration => {
+    registration.active.postMessage("Hi service worker");
+  });
+
+}
+ +

次のように、サービスワーカーは、message イベントをリッスンしてメッセージを受信できます。

+ +
// サービスワーカー内
+addEventListener('message', event => {
+  // event は ExtendableMessageEvent オブジェクトです
+  console.log(`The client sent me a message: ${event.data}`);
+
+  event.source.postMessage("Hi client");
+});
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Service Workers', '#extendablemessageevent', 'ExtendableMessageEvent')}}{{Spec2('Service Workers')}}初期定義
+ +

ブラウザーの互換性

+ +
+ + +

{{Compat("api.ExtendableMessageEvent")}}

+
+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf