FetchEvent - Web-APIs | MDN

Seitenleiste umschalten

Farbschema

Systemeinstellung
Hell
Dunkel

Deutsch

Sprache merken Mehr erfahren

FetchEvent

Baseline Weitgehend verfügbar *

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit April 2018 browserübergreifend verfügbar.

* Einige Teile dieser Funktion werden möglicherweise unterschiedlich gut unterstützt.

Hinweis: Diese Funktion ist nur in Service Workers verfügbar.

Dies ist der Ereignistyp für fetch-Ereignisse, die im Service Worker Global Scope ausgelöst werden. Es enthält Informationen über den Abruf, einschließlich der Anfrage und wie der Empfänger die Antwort behandeln wird. Es stellt die Methode event.respondWith() bereit, die es uns ermöglicht, eine Antwort auf diesen Abruf bereitzustellen.

Event ExtendableEvent FetchEvent

In diesem Artikel

Konstruktor

FetchEvent()

Erstellt ein neues FetchEvent-Objekt. Dieser Konstruktor wird typischerweise nicht verwendet. Der Browser erstellt diese Objekte und stellt sie fetch-Ereignisrückrufen zur Verfügung.

Instanz-Eigenschaften

Erbt Eigenschaften von seinem Vorfahren, Event.

FetchEvent.clientId Schreibgeschützt

Die id des gleichnamigen client, der den Abruf initiiert hat.

FetchEvent.handled Schreibgeschützt

Ein Versprechen, das anhängig ist, während das Ereignis nicht behandelt wurde, und erfüllt wird, sobald es behandelt wurde.

FetchEvent.isReload Schreibgeschützt

Gibt true zurück, wenn das Ereignis vom Benutzer ausgelöst wurde, der versucht hat, die Seite neu zu laden, andernfalls false.

FetchEvent.preloadResponse Schreibgeschützt

Ein Promise für eine Response, oder undefined, wenn dieser Abruf keine Navigation ist oder Navigation Preload nicht aktiviert ist.

FetchEvent.replacesClientId Schreibgeschützt

Die id des client, der während einer Seitennavigation ersetzt wird.

FetchEvent.resultingClientId Schreibgeschützt

Die id des client, der den vorherigen Client während einer Seitennavigation ersetzt.

FetchEvent.request Schreibgeschützt

Die Request, die der Browser ausführen möchte.

Instanz-Methoden

Erbt Methoden von seinem Elternteil, ExtendableEvent.

FetchEvent.respondWith()

Verhindert die Standard-Abrufverarbeitung des Browsers und stellt (ein Versprechen für) eine eigene Antwort bereit.

ExtendableEvent.waitUntil()

Verlängert die Lebensdauer des Ereignisses. Wird verwendet, um den Browser über Aufgaben zu informieren, die über die Rückgabe einer Antwort hinausgehen, wie Streaming und Caching.

Beispiele

Dieses fetch-Ereignis verwendet den Standard des Browsers für Nicht-GET-Anfragen. Bei GET-Anfragen versucht es, einen Cache-Treffer zurückzugeben und weicht auf das Netzwerk aus. Wenn es einen Treffer im Cache findet, aktualisiert es den Cache asynchron für das nächste Mal.

js
self.addEventListener("fetch", (event) => {
  // Let the browser do its default thing
  // for non-GET requests.
  if (event.request.method !== "GET") return;

  // Prevent the default, and handle the request ourselves.
  event.respondWith(
    (async () => {
      // Try to get the response from a cache.
      const cache = await caches.open("dynamic-v1");
      const cachedResponse = await cache.match(event.request);

      if (cachedResponse) {
        // If we found a match in the cache, return it, but also
        // update the entry in the cache in the background.
        event.waitUntil(cache.add(event.request));
        return cachedResponse;
      }

      // If we didn't find a match in the cache, use the network.
      return fetch(event.request);
    })(),
  );
});

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Service Worker API
FetchEvent
Konstruktor
1. FetchEvent()
Instanzeigenschaften
Instanzmethoden
1. respondWith()
Vererbung
1. ExtendableEvent
2. Event
Verwandte Seiten für Service Workers API
Anleitungen
1. Verwenden von Service Workern