CacheStorage: match() Methode
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2018.
Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die match() Methode des CacheStorage Schnittstelle überprüft, ob eine gegebene Request oder URL-Zeichenfolge ein Schlüssel für eine gespeicherte Response ist. Diese Methode gibt ein Promise für eine Response zurück oder ein Promise, das auf undefined aufgelöst wird, wenn kein Treffer gefunden wird.
Sie können auf CacheStorage über die Window.caches Eigenschaft in Fenstern oder über die WorkerGlobalScope.caches Eigenschaft in Workern zugreifen.
Cache-Objekte werden in der Reihenfolge ihrer Erstellung durchsucht.
Hinweis:>caches.match() ist eine bequeme Methode.
Eine gleichwertige Funktionalität besteht darin, cache.match() auf jedem Cache (in der Reihenfolge der von caches.keys() zurückgegebenen Werte) aufzurufen, bis eine Response zurückgegeben wird.
Syntax
match(request)
match(request, options)
Parameter
request-
Die
Request, die Sie abgleichen möchten. Dies kann einRequest-Objekt oder eine URL-Zeichenfolge sein. optionsOptional-
Ein Objekt, dessen Eigenschaften steuern, wie der Abgleich in der
match-Operation durchgeführt wird. Die verfügbaren Optionen sind:ignoreSearch-
Ein boolescher Wert, der angibt, ob der Abgleichsvorgang den Abfrage-String in der URL ignorieren soll. Zum Beispiel, wenn auf
truegesetzt, würde der?value=barTeil vonhttp://foo.com/?value=barignoriert, wenn ein Abgleich durchgeführt wird. Standardmäßig ist diesfalse. ignoreMethod-
Ein boolescher Wert, der, wenn auf
truegesetzt, verhindert, dass die Abgleichsoperationen diehttp-Methode derRequestvalidieren (normalerweise sind nurGETundHEADerlaubt). Standardmäßig ist diesfalse. ignoreVary-
Ein boolescher Wert, der, wenn er auf
truegesetzt ist, der Abgleichsoperation mitteilt, dasVARY-Header-Matching nicht durchzuführen. Mit anderen Worten, wenn die URL übereinstimmt, erhalten Sie einen Treffer, unabhängig davon, ob dasResponse-Objekt einenVARY-Header hat oder nicht. Standardmäßig ist diesfalse. cacheName-
Eine Zeichenfolge, die einen bestimmten Cache zum Durchsuchen darstellt.
Rückgabewert
Ein Promise, das sich zu der übereinstimmenden Response auflöst. Falls keine übereinstimmende Antwort für die angegebene Anfrage gefunden wird, wird das Promise mit undefined aufgelöst.
Beispiele
Dieses Beispiel stammt aus dem MDN einfachen Service Worker Beispiel (siehe einfacher Service Worker läuft live). Hier warten wir darauf, dass ein FetchEvent ausgelöst wird. Wir konstruieren eine benutzerdefinierte Antwort folgendermaßen:
- Überprüfen Sie, ob ein Treffer für die Anfrage im
CacheStoragegefunden wird, indemCacheStorage.match()verwendet wird. Falls vorhanden, wird dieser bedient. - Falls nicht, öffnen Sie den
v1-Cache mitopen(), legen Sie die Standard-Netzwerkanfrage mitCache.put()in den Cache und geben Sie eine Kopie der Standard-Netzwerkanfrage zurück, indem Siereturn response.clone()verwenden. Letzteres ist notwendig, weilput()den Antwortkörper konsumiert. - Wenn dies fehlschlägt (z.B. weil das Netzwerk ausgefallen ist), geben Sie eine Ersatzantwort zurück.
self.addEventListener("fetch", (event) => {
event.respondWith(
caches.match(event.request).then((response) => {
// caches.match() always resolves
// but in case of success response will have value
if (response !== undefined) {
return response;
}
return fetch(event.request)
.then((response) => {
// response may be used only once
// we need to save clone to put one copy in cache
// and serve second one
let responseClone = response.clone();
caches
.open("v1")
.then((cache) => cache.put(event.request, responseClone));
return response;
})
.catch(() => caches.match("/gallery/myLittleVader.jpg"));
}),
);
});
Spezifikationen
| Specification |
|---|
| Service Workers # cache-storage-match |
Browser-Kompatibilität
Loading…