2024/05/07 時点の英語版に基づき新規翻訳

files/ja/web/api/serviceworkerglobalscope/backgroundfetchabort_event/index.md

@@ -0,0 +1,68 @@
+---
+title: "ServiceWorkerGlobalScope: backgroundfetchabort イベント"
+short-title: backgroundfetchabort
+slug: Web/API/ServiceWorkerGlobalScope/backgroundfetchabort_event
+l10n:
+  sourceCommit: c77a11ee1509542c16b0348afc4fcb3ffe588e1c
+---
+
+{{APIRef("Background Fetch API")}}{{SeeCompatTable}}{{SecureContext_Header}}{{AvailableInWorkers("service")}}
+
+**`backgroundfetchabort`** は {{domxref("ServiceWorkerGlobalScope")}} インターフェイスのイベントで、ユーザーまたはアプリ自体が[バックグラウンドフェッチ操作](/ja/docs/Web/API/Background_Fetch_API)をキャンセルしたときに発生します。
+
+このイベントはキャンセル不可で、バブリングしません。
+
+## 構文
+
+このイベント名を {{domxref("EventTarget.addEventListener", "addEventListener()")}} などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
+
+```js
+addEventListener("backgroundfetchabort", (event) => {});
+
+onbackgroundfetchabort = (event) => {};
+```
+
+## イベント型
+
+{{domxref("BackgroundFetchEvent")}} です。
+
+{{InheritanceDiagram("BackgroundFetchEvent")}}
+
+## イベントプロパティ
+
+_親である {{domxref("ExtendableEvent")}} から継承したプロパティがあります。_
+
+- {{domxref("BackgroundFetchEvent.registration")}}
+  - : 中止されたフェッチのための {{domxref("BackgroundFetchRegistration")}} を返します。
+
+## 解説
+
+バックグラウンドフェッチ API では、ブラウザーがユーザーに UI 要素を表示して操作の進行状況を示します。この要素により、ユーザーはフェッチをキャンセルすることもできます。アプリ自体も、{{domxref("BackgroundFetchRegistration.abort()")}} を呼び出すことでフェッチをキャンセルできます。
+
+フェッチがキャンセルされた場合、ブラウザーはフェッチを中止し、必要に応じてサービスワーカーを起動し、そのサービスワーカーのグローバルスコープで `backgroundfetchabort` イベントを発生させます。
+
+このイベントのハンドラー内で、サービスワーカーは操作に関連するデータをクリーンアップできます。また、成功したレスポンスをすべて取得して保存することもできます（例えば、{{domxref("Cache")}} API を使用して）。レスポンスデータにアクセスするために、サービスワーカーはイベントの {{domxref("BackgroundFetchEvent/registration", "registration")}} プロパティを使用します。
+
+## 例
+
+### クリーンアップ
+
+このイベントハンドラーは、中止されたフェッチに関連するデータのクリーンアップを実行することができます。
+
+```js
+addEventListener("backgroundfetchabort", (event) => {
+  // 関連するデータをクリーンアップ
+});
+```
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- [バックグラウンドフェッチ API](/ja/docs/Web/API/Background_Fetch_API)

files/ja/web/api/serviceworkerglobalscope/backgroundfetchclick_event/index.md

@@ -0,0 +1,72 @@
+---
+title: "ServiceWorkerGlobalScope: backgroundfetchclick イベント"
+short-title: backgroundfetchclick
+slug: Web/API/ServiceWorkerGlobalScope/backgroundfetchclick_event
+l10n:
+  sourceCommit: c77a11ee1509542c16b0348afc4fcb3ffe588e1c
+---
+
+{{APIRef("Background Fetch API")}}{{SeeCompatTable}}{{SecureContext_Header}}{{AvailableInWorkers("service")}}
+
+**`backgroundfetchclick`** は {{domxref("ServiceWorkerGlobalScope")}} インターフェイスのイベントで、[バックグラウンドフェッチ](/ja/docs/Web/API/Background_Fetch_API)操作の進捗状況をユーザーに表示するためにブラウザーが提供する UI をユーザーがクリックしたときに発生します。
+
+このイベントはキャンセル不可で、バブリングしません。
+
+## 構文
+
+このイベント名を {{domxref("EventTarget.addEventListener", "addEventListener()")}} などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
+
+```js
+addEventListener("backgroundfetchclick", (event) => {});
+
+onbackgroundfetchclick = (event) => {};
+```
+
+## イベント型
+
+{{domxref("BackgroundFetchEvent")}} です。
+
+{{InheritanceDiagram("BackgroundFetchEvent")}}
+
+## イベントプロパティ
+
+_親である {{domxref("ExtendableEvent")}} から継承したプロパティがあります。_
+
+- {{domxref("BackgroundFetchEvent.registration")}}
+  - : 中止されたフェッチのための {{domxref("BackgroundFetchRegistration")}} を返します。
+
+## 解説
+
+[バックグラウンドフェッチ](/ja/docs/Web/API/Background_Fetch_API)操作が開始されると、ブラウザーはユーザーに UI 要素を表示して操作の進行状況を示します。ユーザーがこの要素をクリックすると、ブラウザーは必要に応じてサービスワーカーを開始し、サービスワーカーのグローバルスコープで `backgroundfetchclick` イベントを発生させます。
+
+このような状況下でハンドラーが実行する一般的なタスクは、ユーザーにフェッチ操作の詳細情報を提供するウィンドウを開くことです。
+
+## 例
+
+### 詳細を表示するウィンドウを開く
+
+このイベントハンドラーは、グローバルな {{domxref("ServiceWorkerGlobalScope.clients", "clients")}} プロパティを使用して、フェッチに関する詳細情報をユーザーに提供するウィンドウを開きます。フェッチが完了しているか否かによって、異なるウィンドウが開きます。
+
+```js
+addEventListener("backgroundfetchclick", (event) => {
+  const registration = event.registration;
+
+  if (registration.result === "success") {
+    clients.openWindow("/play-movie");
+  } else {
+    clients.openWindow("/movie-download-progress");
+  }
+});
+```
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- [バックグラウンドフェッチ API](/ja/docs/Web/API/Background_Fetch_API)

files/ja/web/api/serviceworkerglobalscope/backgroundfetchfail_event/index.md

@@ -0,0 +1,68 @@
+---
+title: "ServiceWorkerGlobalScope: backgroundfetchfail イベント"
+short-title: backgroundfetchfail
+slug: Web/API/ServiceWorkerGlobalScope/backgroundfetchfail_event
+l10n:
+  sourceCommit: c77a11ee1509542c16b0348afc4fcb3ffe588e1c
+---
+
+{{APIRef("Background Fetch API")}}{{SeeCompatTable}}{{SecureContext_Header}}{{AvailableInWorkers("service")}}
+
+**`backgroundfetchfail`** は {{domxref("ServiceWorkerGlobalScope")}} インターフェイスのイベントで、[バックグラウンドフェッチ](/ja/docs/Web/API/Background_Fetch_API)操作が失敗した場合、つまり、フェッチ内の少なくとも 1 つのネットワークリクエストが正常に完了しなかった場合に発生します。
+
+このイベントはキャンセル不可で、バブリングしません。
+
+## 構文
+
+このイベント名を {{domxref("EventTarget.addEventListener", "addEventListener()")}} などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
+
+```js
+addEventListener("backgroundfetchfail", (event) => {});
+
+onbackgroundfetchfail = (event) => {};
+```
+
+## イベント型
+
+{{domxref("BackgroundFetchUpdateUIEvent")}} です。
+
+{{InheritanceDiagram("BackgroundFetchUpdateUIEvent")}}
+
+## イベントプロパティ
+
+_親である {{domxref("BackgroundFetchEvent")}} から継承したプロパティがあります。_
+
+- {{domxref("BackgroundFetchUpdateUIEvent.updateUI()")}}
+  - : ブラウザーがフェッチ操作の進捗状況を表示するために表示する要素の UI を更新します。
+
+## 解説
+
+[バックグラウンドフェッチ](/ja/docs/Web/API/Background_Fetch_API)操作が失敗した場合（つまり、個々のネットワークリクエストの少なくとも 1 つが正常に完了していない場合）、ブラウザーは必要に応じてサービスワーカーを起動し、サービスワーカーのグローバルスコープで `backgroundfetchfail` イベントを発行します。
+
+バックグラウンドフェッチ API では、ブラウザーはユーザーに操作の進行状況を示す UI 要素を表示します。`backgroundfetchfail` ハンドラーでは、サービスワーカーがその UI を更新して操作が失敗したことを示すことができます。これを行うには、ハンドラーがイベントの {{domxref("BackgroundFetchUpdateUIEvent/updateUI", "updateUI()")}} メソッドを呼び出し、新しいタイトルやアイコンを渡します。
+
+この `backgroundfetchfail` のハンドラーでは、サービスワーカーは操作に関連するデータをクリーンアップすることもできます。また、成功したレスポンスをすべて取得して（{{domxref("Cache")}} APIを使用して）保存することもできます。レスポンスデータにアクセスするために、サービスワーカーはイベントの {{domxref("BackgroundFetchEvent/registration", "registration")}} プロパティを使用します。
+
+## 例
+
+### UI の更新
+
+このイベントハンドラーは、操作が失敗したことをユーザーに知らせるために UI を更新します。
+
+```js
+addEventListener("backgroundfetchfail", (event) => {
+  event.updateUI({ title: "Could not complete download" });
+});
+```
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- [バックグラウンドフェッチ API](/ja/docs/Web/API/Background_Fetch_API)

files/ja/web/api/serviceworkerglobalscope/backgroundfetchsuccess_event/index.md

@@ -0,0 +1,86 @@
+---
+title: "ServiceWorkerGlobalScope: backgroundfetchsuccess イベント"
+short-title: backgroundfetchsuccess
+slug: Web/API/ServiceWorkerGlobalScope/backgroundfetchsuccess_event
+l10n:
+  sourceCommit: c77a11ee1509542c16b0348afc4fcb3ffe588e1c
+---
+
+{{APIRef("Background Fetch API")}}{{SeeCompatTable}}{{SecureContext_Header}}{{AvailableInWorkers("service")}}
+
+**`backgroundfetchsuccess`** は {{domxref("ServiceWorkerGlobalScope")}} インターフェイスのイベントで、[バックグラウンドフェッチ](/ja/docs/Web/API/Background_Fetch_API)操作が正常に完了したとき、つまり、フェッチで行うネットワークリクエストがすべて正常に完了したときに発行されます。
+
+このイベントはキャンセル不可で、バブリングしません。
+
+## 構文
+
+このイベント名を {{domxref("EventTarget.addEventListener", "addEventListener()")}} などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
+
+```js
+addEventListener("backgroundfetchsuccess", (event) => {});
+
+onbackgroundfetchsuccess = (event) => {};
+```
+
+## イベント型
+
+{{domxref("BackgroundFetchUpdateUIEvent")}} です。
+
+{{InheritanceDiagram("BackgroundFetchUpdateUIEvent")}}
+
+## イベントプロパティ
+
+_親である {{domxref("BackgroundFetchEvent")}} から継承したプロパティがあります。_
+
+- {{domxref("BackgroundFetchUpdateUIEvent.updateUI()")}}
+  - : ブラウザーがフェッチ操作の進捗状況を表示するために表示する要素の UI を更新します。
+
+## 解説
+
+[バックグラウンドフェッチ](/ja/docs/Web/API/Background_Fetch_API)操作が正常に完了すると（つまり、すべての個々のネットワークリクエストが正常に完了すると）、必要に応じてブラウザーはサービスワーカーを開始し、サービスワーカーのグローバルスコープで `backgroundfetchsuccess` イベントを発行します。
+
+このイベントのハンドラーでは、サービスワーカーはレスポンスを取得し、（例えば、{{domxref("Cache")}} API を使用して）保存することができます。レスポンスデータにアクセスするには、サービスワーカーはイベントの {{domxref("BackgroundFetchEvent/registration", "registration")}} プロパティを使用します。
+
+バックグラウンドフェッチ API では、ブラウザーはユーザーに操作の進行状況を示す UI 要素を表示します。`backgroundfetchsuccess` ハンドラーでは、サービスワーカーがその UI を更新して操作が成功したことを示すことができます。これを行うには、ハンドラーがイベントの {{domxref("BackgroundFetchUpdateUIEvent/updateUI", "updateUI()")}} メソッドを呼び出し、新しいタイトルやアイコンを渡します。
+
+## 例
+
+### レスポンスを保存して UI を更新
+
+このイベントハンドラーは、すべてのレスポンスをキャッシュに格納し、UI を更新します。
+
+```js
+addEventListener("backgroundfetchsuccess", (event) => {
+  const registration = event.registration;
+
+  event.waitUntil(async () => {
+    // Open a cache
+    const cache = await caches.open("movies");
+    // Get all the records
+    const records = await registration.matchAll();
+    // Cache all responses
+    const cachePromises = records.map(async (record) => {
+      const response = await record.responseReady;
+      await cache.put(record.request, response);
+    });
+
+    // Wait for caching to finish
+    await Promise.all(cachePromises);
+
+    // Update the browser's UI
+    event.updateUI({ title: "Move download complete" });
+  });
+});
+```
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- [バックグラウンドフェッチ API](/ja/docs/Web/API/Background_Fetch_API)