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

{{domxref("ServiceWorkerGlobalScope")}} インターフェイスの onfetch プロパティは、{{Event("fetch")}} イベントが発生するたびに（通常、{{domxref("WindowOrWorkerGlobalScope.fetch()")}} メソッドが呼び出されたときに）発火するイベントハンドラーです。

+ +

構文

+ +
serviceWorkerGlobalScope.onfetch = function(fetchEvent) { ... };
+ +

例

+ +

このコードスニペットは、サービスワーカーのプリフェッチの例からのものです（プリフェッチの例をライブで見る）。{{domxref("ServiceWorkerGlobalScope.onfetch")}} イベントハンドラーは、fetch イベントをリッスンします。 コードが実行されると、コードは、{{domxref("Cache")}} オブジェクト内の最初に一致するリクエストに解決するプロミスを返します。 一致が見つからない場合、コードはネットワークからレスポンスをフェッチします。

+ +

このコードは、{{domxref("WindowOrWorkerGlobalScope.fetch", "fetch()")}} 操作からスローされた例外も処理します。 HTTP エラーレスポンス（404 など）は例外をトリガーしないことに注意してください。 適切なエラーコードが設定された通常のレスポンスオブジェクトを返します。

+ +
self.addEventListener('fetch', function(event) {
+  console.log('Handling fetch event for', event.request.url);
+
+  event.respondWith(
+    caches.match(event.request).then(function(response) {
+      if (response) {
+        console.log('Found response in cache:', response);
+
+        return response;
+      }
+      console.log('No response found in cache. About to fetch from network...');
+
+      return fetch(event.request).then(function(response) {
+        console.log('Response from network is:', response);
+
+        return response;
+      }).catch(function(error) {
+        console.error('Fetching failed:', error);
+
+        throw error;
+      });
+    })
+  );
+});
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Service Workers', '#service-worker-global-scope-event-handlers', 'Event Handlers')}}{{Spec2('Service Workers')}}初期定義
+ +

ブラウザーの互換性

+ +
+ + +

{{Compat("api.ServiceWorkerGlobalScope.onfetch")}}

+
+ +

関連情報

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