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/client/frametype/index.html | 50 ++++++++++++++ files/ja/web/api/client/id/index.html | 50 ++++++++++++++ files/ja/web/api/client/index.html | 66 ++++++++++++++++++ files/ja/web/api/client/postmessage/index.html | 94 ++++++++++++++++++++++++++ files/ja/web/api/client/type/index.html | 75 ++++++++++++++++++++ files/ja/web/api/client/url/index.html | 69 +++++++++++++++++++ 6 files changed, 404 insertions(+) create mode 100644 files/ja/web/api/client/frametype/index.html create mode 100644 files/ja/web/api/client/id/index.html create mode 100644 files/ja/web/api/client/index.html create mode 100644 files/ja/web/api/client/postmessage/index.html create mode 100644 files/ja/web/api/client/type/index.html create mode 100644 files/ja/web/api/client/url/index.html (limited to 'files/ja/web/api/client') diff --git a/files/ja/web/api/client/frametype/index.html b/files/ja/web/api/client/frametype/index.html new file mode 100644 index 0000000000..c1fb5d1f6d --- /dev/null +++ b/files/ja/web/api/client/frametype/index.html @@ -0,0 +1,50 @@ +--- +title: Client.frameType +slug: Web/API/Client/frameType +tags: + - API + - Client + - Property + - Reference + - Service Workers + - ServiceWorker + - frameType +translation_of: Web/API/Client/frameType +--- +

{{SeeCompatTable}}{{APIRef("Service Workers API")}}

+ +

{{domxref("Client")}} インターフェイスの frameType 読み取り専用プロパティは、現在の {{domxref("Client")}} の閲覧コンテキストの種類を示します。 この値は、"auxiliary"、"top-level"、"nested"、"none" のいずれかです。

+ +

構文

+ +
var myFrameType = client.frameType;
+ +

例

+ +
未定
+
+ +

仕様

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

ブラウザーの互換性

+ +
+ + +

{{Compat("api.Client.frameType")}}

+
diff --git a/files/ja/web/api/client/id/index.html b/files/ja/web/api/client/id/index.html new file mode 100644 index 0000000000..f1eb5b03f1 --- /dev/null +++ b/files/ja/web/api/client/id/index.html @@ -0,0 +1,50 @@ +--- +title: Client.id +slug: Web/API/Client/id +tags: + - API + - Client + - Property + - Reference + - Service Workers + - ServiceWorker + - id +translation_of: Web/API/Client/id +--- +

{{APIRef("Service Workers API")}}

+ +

{{domxref("Client")}} インターフェイスの id 読み取り専用プロパティは、{{domxref("Client")}} オブジェクトの汎用一意識別子を返します。

+ +

構文

+ +
var clientId = client.id;
+ +

例

+ +
未定
+
+ +

仕様

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

ブラウザーの互換性

+ +
+ + +

{{Compat("api.Client.id")}}

+
diff --git a/files/ja/web/api/client/index.html b/files/ja/web/api/client/index.html new file mode 100644 index 0000000000..c93d6ff9e7 --- /dev/null +++ b/files/ja/web/api/client/index.html @@ -0,0 +1,66 @@ +--- +title: Client +slug: Web/API/Client +tags: + - API + - Client + - Interface + - Reference + - Service Workers + - Service worker API + - ServiceWorkerClient + - ServiceWorkers +translation_of: Web/API/Client +--- +

{{APIRef("Service Workers API")}}

+ +

Client インターフェイスは、{{domxref("Worker")}} や {{domxref("SharedWorker")}} などの実行可能なコンテキストを表します。 {{domxref("Window")}} クライアントは、より具体的な {{domxref("WindowClient")}} によって表されます。 {{domxref("Clients.matchAll","Clients.matchAll()")}} や {{domxref("Clients.get","Clients.get()")}} などのメソッドから Client/WindowClient オブジェクトを取得できます。

+ +

メソッド

+ +
+
{{domxref("Client.postMessage()")}}
+
メッセージをクライアントに送信します。
+
+ +

プロパティ

+ +
+
{{domxref("Client.id")}} {{readonlyInline}}
+
文字列としてのクライアントの汎用一意識別子。
+
{{domxref("Client.type")}} {{readonlyInline}}
+
文字列としてのクライアントの種類。 "window"、"worker"、"sharedworker" のいずれかです。
+
{{domxref("Client.url")}} {{readonlyInline}}
+
文字列としてのクライアントの URL。
+
+ +

仕様

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

ブラウザーの互換性

+ + + +

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

+ +

関連情報

+ + diff --git a/files/ja/web/api/client/postmessage/index.html b/files/ja/web/api/client/postmessage/index.html new file mode 100644 index 0000000000..a4b4556f7b --- /dev/null +++ b/files/ja/web/api/client/postmessage/index.html @@ -0,0 +1,94 @@ +--- +title: Client.postMessage() +slug: Web/API/Client/postMessage +tags: + - API + - Client + - Method + - Reference + - Service Workers + - Service worker API + - ServiceWorker + - postMessage +translation_of: Web/API/Client/postMessage +--- +

{{APIRef("Service Worker API")}}

+ +

postMessage() は {{domxref("Client")}} インターフェイスのメソッドで、サービスワーカーがクライアント ({{domxref("Window")}}, {{domxref("Worker")}}, {{domxref("SharedWorker")}}) にメッセージを送信することができます。 メッセージは、 {{domxref("ServiceWorkerContainer", "navigator.serviceWorker")}} の "message" イベントで受信されます。

+ +

構文

+ +
client.postMessage(message[, transfer]);
+client.postMessage(message[, { transfer }]);
+
+ +

引数

+ +
+
message
+
クライアントに送信するメッセージです。これは、任意の複製可能な構造化型にすることができます。
+
transfer {{optional_inline}}
+
メッセージとともに転送されるオブジェクトのシーケンスです。 これらのオブジェクトの所有権は宛先側に与えられ、送信側では使用できなくなります。
+
+ +

返値

+ +

undefined。

+ +

例

+ +

サービスワーカーからクライアントへのメッセージの送信

+ +
addEventListener('fetch', event => {
+  event.waitUntil(async function() {
+    // クライアントにアクセスできない場合は、早期に終了します。
+    // 例えば、クロスオリジンの場合。
+    if (!event.clientId) return;
+
+    // クライアントを取得します。
+    const client = await clients.get(event.clientId);
+    // クライアントを取得できない場合は、早期に終了します。
+    // 例えば、閉じている場合。
+    if (!client) return;
+
+    // クライアントにメッセージを送信します。
+    client.postMessage({
+      msg: "私はあなたからフェッチされましたよ！",
+      url: event.request.url
+    });
+
+  }());
+});
+ +

そのメッセージの受け取り

+ +
navigator.serviceWorker.addEventListener('message', event => {
+  console.log(event.data.msg, event.data.url);
+});
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('Service Workers', '#dom-client-postmessage-message-options', 'postMessage()')}}{{Spec2('Service Workers')}}初回定義
+ +

ブラウザーの互換性

+ +
+ + +

{{Compat("api.Client.postMessage")}}

+
diff --git a/files/ja/web/api/client/type/index.html b/files/ja/web/api/client/type/index.html new file mode 100644 index 0000000000..74133f20b2 --- /dev/null +++ b/files/ja/web/api/client/type/index.html @@ -0,0 +1,75 @@ +--- +title: Client.type +slug: Web/API/Client/type +tags: + - API + - Client + - Property + - Reference + - Service Workers + - Type +translation_of: Web/API/Client/type +--- +

{{APIRef("Service Workers API")}}

+ +

{{domxref("Client")}} インターフェイスの type 読み取り専用プロパティは、サービスワーカーが制御しているクライアントの種類を示します。

+ +

構文

+ +
var myClientType = client.type;
+ +

値

+ +

クライアントの種類を表す文字列。 値は次のいずれかです。

+ + + +

例

+ +
// サービスワーカークライアント（ドキュメントなど）
+function sendMessage(message) {
+  return new Promise(function(resolve, reject) {
+    // これは ServiceWorker.postMessage バージョンであることに注意してください
+    navigator.serviceWorker.controller.postMessage(message);
+    window.serviceWorker.onMessage = function(e) {
+      resolve(e.data);
+    };
+  });
+}
+
+// 制御するサービスワーカー
+self.addEventListener("message", function(e) {
+  // e.source はクライアントオブジェクトです
+  e.source.postMessage("こんにちは！ あなたのメッセージは: " + e.data);
+  // type 値も投稿してクライアントに戻しましょう
+  e.source.postMessage(e.source.type);
+});
+ +

仕様

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

ブラウザーの互換性

+ +
+ + +

{{Compat("api.Client.type")}}

+
diff --git a/files/ja/web/api/client/url/index.html b/files/ja/web/api/client/url/index.html new file mode 100644 index 0000000000..91a3e30068 --- /dev/null +++ b/files/ja/web/api/client/url/index.html @@ -0,0 +1,69 @@ +--- +title: Client.url +slug: Web/API/Client/url +tags: + - API + - Client + - Property + - Reference + - Service Workers + - URL +translation_of: Web/API/Client/url +--- +
{{APIRef("Service Workers API")}}
+ +

{{domxref("Client")}} インターフェイスの url 読み取り専用プロパティは、現在のサービスワーカークライアントの URL を返します。

+ +

構文

+ +
var clientUrl = client.url;
+ +

値

+ +

{{domxref("USVString")}}。

+ +

例

+ +
self.addEventListener('notificationclick', function(event) {
+  console.log('On notification click: ', event.notification.tag);
+  event.notification.close();
+
+  // これは、クライアントが既に開いているかどうかを確認し、
+  // 開いている場合にフォーカスを合わせます
+  event.waitUntil(clients.matchAll({
+    type: 'window'
+  }).then(function(clientList) {
+    for (var i = 0; i < clientList.length; i++) {
+      var client = clientList[i];
+      if (client.url == '/' && 'focus' in client)
+        return client.focus();
+    }
+    if (clients.openWindow)
+      return clients.openWindow('/');
+  }));
+});
+ +

仕様

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

ブラウザーの互換性

+ +
+ + +

{{Compat("api.Client.url")}}

+
-- cgit v1.2.3-54-g00ecf