Anfrage: Eigenschaft isReloadNavigation
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die schreibgeschützte Eigenschaft isReloadNavigation des Request-Interfaces ist ein Boolean, der anzeigt, ob die Anfrage durch ein vom Benutzer ausgelöstes Neuladen erfolgt.
Ein vom Benutzer ausgelöstes Neuladen kann über eine Browsersteuerung ausgelöst werden, wie etwa durch Drücken von Cmd/Ctrl + R oder Klicken auf die Neuladen-Schaltfläche des Browsers oder programmatisch (zum Beispiel durch Aufrufen von Location.reload(), History.go(0) oder Navigation.reload()).
Diese Eigenschaft wird hauptsächlich innerhalb der fetch-Ereignishandler von Service Workern verwendet, um angemessen auf Neuladeanforderungen im Gegensatz zu Nicht-Neuladeanforderungen zu reagieren. Zum Beispiel zeigt eine Neuladeanforderung an, dass der Benutzer aktuelle Daten erwartet, daher sollte der Inhalt vom Server dem aus einem Cache bevorzugt werden.
Wert
Ein Boolean-Wert.
Beispiele
Grundlegende Verwendung
Das folgende Beispiel kann in einem Service Worker-Skript verwendet werden, um auf Neuladevorgänge zu prüfen und angemessen zu reagieren.
Innerhalb eines fetch-Ereignishandlers prüfen wir zuerst, ob der Request.mode des Ereignisses navigate ist und ob die isReloadNavigation-Eigenschaft true ist. Wenn dies der Fall ist, handelt es sich um eine Neuladenavigation; wir holen daher die Seite aus dem Netzwerk, um eine aktualisierte Version bereitzustellen. Wenn das fehlschlägt, versuchen wir, die Seite als Fallback aus dem Cache abzurufen.
Wenn die Navigation keine Neuladenavigation ist, versuchen wir zuerst, die Seite aus dem Cache abzurufen und greifen nur dann auf das Netzwerk zurück, wenn keine zwischengespeicherte Version der Seite gefunden wird.
self.addEventListener("fetch", (event) => {
if (event.request.mode === "navigate" && event.request.isReloadNavigation) {
event.respondWith(
fetch(event.request)
.then((response) => {
return response;
})
.catch(() => caches.match(event.request)),
);
} else {
event.respondWith(
caches.match(event.request).then((cached) => {
return cached || fetch(event.request);
}),
);
}
});
Spezifikationen
| Spezifikation |
|---|
| Fetch # dom-request-isreloadnavigation |