Cache: 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: Dieses Feature ist verfügbar in Web Workers.
Die match()
-Methode der Cache
-Schnittstelle gibt ein Promise
zurück, das sich auf die Response
auflöst, die mit der ersten übereinstimmenden Anfrage im Cache
-Objekt verknüpft ist.
Wenn keine Übereinstimmung gefunden wird, löst sich das Promise
in undefined
auf.
Syntax
match(request)
match(request, options)
Parameter
request
-
Die
Request
, für die Sie versuchen, Antworten imCache
zu finden. Dies kann einRequest
-Objekt oder eine URL-Zeichenkette sein. options
Optional-
Ein Objekt, das Optionen für die
match
-Operation festlegt. Die verfügbaren Optionen sind:ignoreSearch
-
Ein boolescher Wert, der angibt, ob die Abfragezeichenfolge in der URL ignoriert werden soll. Wenn zum Beispiel
true
gesetzt ist, würde der?value=bar
-Teil vonhttp://foo.com/?value=bar
bei der Durchführung einer Übereinstimmung ignoriert werden. Standardmäßig ist esfalse
. ignoreMethod
-
Ein boolescher Wert, der, wenn er auf
true
gesetzt ist, verhindert, dass Matching-Operationen die HTTP-Methode derRequest
validieren (normalerweise sind nurGET
undHEAD
erlaubt). Standardmäßig ist esfalse
. ignoreVary
-
Ein boolescher Wert, der, wenn auf
true
gesetzt, der Übereinstimmungsoperation mitteilt, keinVARY
- Header-Matching durchzuführen – d. h., wenn die URL übereinstimmt, erhalten Sie eine Übereinstimmung, unabhängig davon, ob dasResponse
-Objekt einenVARY
-Header hat. Standardmäßig ist esfalse
.
Rückgabewert
Ein Promise
, das sich auf die erste Response
auflöst, die der Anfrage entspricht, oder auf undefined
, wenn keine Übereinstimmung gefunden wird.
Note:
Cache.match()
ist im Wesentlichen identisch mitCache.matchAll()
, außer dass es sich nicht mit einem Array aller übereinstimmenden Antworten auflöst, sondern nur mit der ersten übereinstimmenden Antwort (d. h.response[0]
).
Beispiele
Dieses Beispiel stammt aus dem benutzerdefinierten Offline-Seiten-Beispiel (Live-Demo). Es verwendet einen Cache, um ausgewählte Daten bereitzustellen, wenn eine Anfrage fehlschlägt. Eine
catch()
-Klausel wird ausgelöst, wenn der Aufruf von fetch()
eine
Ausnahme auslöst. Innerhalb der catch()
-Klausel wird match()
verwendet, um
die korrekte Antwort zurückzugeben.
In diesem Beispiel werden nur HTML-Dokumente, die mit dem HTTP-Verb GET abgerufen werden, im
Cache gespeichert. Wenn unsere if ()
-Bedingung falsch ist, dann fängt dieser Fetch-Handler die Anfrage nicht ab. Wenn andere Fetch-Handler registriert sind, erhalten sie die Gelegenheit, event.respondWith()
aufzurufen. Wenn keine Fetch-Handler event.respondWith()
aufrufen, wird die Anfrage vom Browser so behandelt, als ob kein Service Worker beteiligt wäre. Wenn fetch()
eine gültige HTTP-Antwort mit einem Antwortcode im Bereich von 4xx oder 5xx zurückgibt, wird catch()
NICHT aufgerufen.
self.addEventListener("fetch", (event) => {
// We only want to call event.respondWith() if this is a GET request for an HTML document.
if (
event.request.method === "GET" &&
event.request.headers.get("accept").includes("text/html")
) {
console.log("Handling fetch event for", event.request.url);
event.respondWith(
fetch(event.request).catch((e) => {
console.error("Fetch failed; returning offline page instead.", e);
return caches
.open(OFFLINE_CACHE)
.then((cache) => cache.match(OFFLINE_URL));
}),
);
}
});
Spezifikationen
Specification |
---|
Service Workers # cache-match |
Browser-Kompatibilität
BCD tables only load in the browser