CacheStorage.match()
Expérimental: Cette fonction est expérimentale
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.
La fonction match()
de l'interface CacheStorage
qu'une Requête
est la clé d'un objet Cache
object suivie par un objet CacheStorage
et retourne une Promesse
qui renvoie la Réponse
correspondante.
Vous pouvez accéder à CacheStorage
via la propriété globale caches
.
Les objets Cache
sont cherchés par ordre de création.
Note : caches.match()
est une méthode de commodité. Une fonctionnalité équivalente consiste à appeler cache.match()
sur chaque cache (dans l'ordre renvoyé par caches.keys()
) jusqu'à ce qu'une Réponse
soit renvoyée.
Syntaxe
caches.match(request, { options }).then(function (response) {
// faire quelque-chose avec la requête et la réponse
});
Paramètres
- request
-
La
Requête
recherchée. - options Facultatif
-
Un objet dont les propriétés contrôlent comment la correspondance est fait avec l'opération
match
. Les options disponible sont:ignoreSearch
: UnBoolean
qui détermine si le preocessus de rapprochement doit ignorer la chaîne de requête dans l'url. Défini àtrue
, la partie?value=bar
dehttp://foo.com/?value=bar
sera ignoré lors d'un rapporchement. La valeur par défaut estfalse
.ignoreMethod
: UnBoolean
qui, quand défini àtrue
, empêche l'opération de rapprochement de valider le verbe http de laRequête
http
(normalement, seulementGET
etHEAD
sont authorisés) La valeur par défaut estfalse
.ignoreVary
: UnBoolean
qui, quand défini àtrue
, dit à l'opération de rapprochement de ne pas faire le rapprochement avec le headerVARY
. En d'autres termes, si une URL est sélectionnée elle sera conservée indépemment de la présence du headerVARY
. La valeur par défaut estfalse
.cacheName
: UnDOMString
qui représente le cache dans lequel on recherche.
Valeur retournée
Exemples
Cet exemple est tiré du MDN sw-test example (voir sw-test running live). Nous attendons pour un évènement FetchEvent
et nous construisons une réponse comme suit:
- Vérifier si une correspondance pour la requète est trouvée dans le
CacheStorage
en utilisantCacheStorage.match
. Si oui, la servir. - Si non, ouvrire le cache
v1
avecopen()
, mettre le réseau par défaut dans le cache avecCache.put
et retourner un clone du réseau par défaut en utilisantreturn response.clone()
— obligatoire carput()
détruit le corps de la réponse. - Si ceci échoue (e.g., parce que le réseau est inactif), retourner une réponse de secours.
self.addEventListener("fetch", function (event) {
event.respondWith(
caches.match(event.request).then(function (response) {
// caches.match() always resolves
// but in case of success response will have value
if (response !== undefined) {
return response;
} else {
return fetch(event.request)
.then(function (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(function (cache) {
cache.put(event.request, responseClone);
});
return response;
})
.catch(function () {
return caches.match("/sw-test/gallery/myLittleVader.jpg");
});
}
}),
);
});
Spécifications
Specification |
---|
Service Workers # cache-storage-match |
Compatibilité des navigateurs
BCD tables only load in the browser