Anforderung: isReloadNavigation-Eigenschaft
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Die schreibgeschützte Eigenschaft isReloadNavigation der Request Schnittstelle ist ein Boolean, der angibt, ob die Anforderung durch eine vom Benutzer ausgelöste Neuanschaffung ausgelöst wurde.
Eine vom Benutzer ausgelöste Neuanschaffung kann über ein Browser-Steuerelement ausgelöst werden, wie das Drücken von Cmd/Ctrl + R oder durch Klicken auf die Neuanschaffungsschaltfläche des Browsers, oder programmatisch (zum Beispiel durch den Aufruf von Location.reload(), History.go(0) oder Navigation.reload()).
Diese Eigenschaft wird hauptsächlich innerhalb von fetch-Ereignis-Handlern von Service Workern verwendet, um angemessen auf Neuanschaffungsanforderungen im Vergleich zu Nicht-Neuanschaffungsanforderungen zu reagieren. Ein Neuanschaffungsanforderung zeigt beispielsweise an, dass der Benutzer aktuelle Daten erwartet, daher sollte der Inhalt vom Server gegenüber dem aus einem Cache bevorzugt werden.
Wert
Ein Boolean-Wert.
Beispiele
Grundlegende Nutzung
Das folgende Beispiel kann in einem Service Worker-Skript verwendet werden, um Neuanschaffungen zu überprüfen und entsprechend zu reagieren.
Innerhalb eines fetch-Ereignis-Handlers prüfen wir zunächst, ob der Request.mode des Ereignisses navigate ist und die isReloadNavigation-Eigenschaften true sind. Wenn ja, handelt es sich um eine Neuanschaffungsnavigation; daher holen wir die Seite aus dem Netzwerk, um eine aktualisierte Version bereitzustellen. Falls das fehlschlägt, versuchen wir, die Seite als Rückfalllösung aus dem Cache abzurufen.
Wenn die Navigation keine Neuanschaffungsnavigation ist, versuchen wir zunächst, die Seite aus dem Cache abzurufen und holen nur dann aus dem Netzwerk, 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 |