FetchEvent: preloadResponse-Eigenschaft

Baseline Weitgehend verfügbar

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

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

Die schreibgeschützte preloadResponse-Eigenschaft des FetchEvent-Interfaces gibt ein Promise zurück, das auf die Navigation Preload Response aufgelöst wird, wenn das Navigation Preload ausgelöst wurde, oder andernfalls undefined.

Das Navigation Preload wird ausgelöst, wenn Navigation Preload aktiviert ist, die Anfrage eine GET-Anfrage ist und die Anfrage eine Navigationsanfrage ist (vom Browser beim Laden von Seiten und iframes erzeugt).

Ein Service Worker kann in seinem Fetch-Event-Handler auf dieses Promise warten, um den Abschluss einer während des Service-Worker-Starts gestellten Fetch-Anfrage zu verfolgen.

In diesem Artikel

Wert

Ein Promise, das auf eine Response oder andernfalls auf undefined aufgelöst wird.

Beispiele

Dieses Codebeispiel stammt aus Beschleunigen Sie Service Worker mit Navigation Preloads.

Der onfetch-Event-Handler lauscht auf das fetch-Event. Wenn es ausgelöst wird, ruft der Handler FetchEvent.respondWith() auf, um ein Promise an die kontrollierte Seite zurückzugeben. Dieses Promise wird mit der angeforderten Ressource aufgelöst.

Wenn es eine passende URL-Anfrage im Cache-Objekt gibt, gibt der Code ein Promise zurück, um die Antwort aus dem Cache zu holen. Wenn kein Treffer im Cache gefunden wird, gibt der Code das Promise in preloadResponse zurück. Wenn es keinen passenden Cache oder vorab geladenen Antwort gibt, holt der Code die Antwort aus dem Netzwerk und gibt das zugehörige Promise zurück.

js
addEventListener("fetch", (event) => {
  event.respondWith(
    (async () => {
      // Respond from the cache if we can
      const cachedResponse = await caches.match(event.request);
      if (cachedResponse) return cachedResponse;

      // Else, use the preloaded response, if it's there
      const response = await event.preloadResponse;
      if (response) return response;

      // Else try 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

FetchEvent: preloadResponse-Eigenschaft

In diesem Artikel

Wert

Beispiele

Spezifikationen

Browser-Kompatibilität

Siehe auch

Help improve MDN