Cache.put()

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 méthode put() de l'interface Cache permet d'ajouter des paires clé/valeur à l'objet Cache en cours.

Souvent, le comportement voulu est juste de fetch() une ou plusieurs requête, et d'ajouter les résultats directement dans le cache. Dans ce type de cas, il est plus judicieux d'utiliser  Cache.add()/Cache.addAll() , étant donné que ces méthodes sont des raccourcis pour une ou plusieurs de ces opérations :

fetch(url).then(function(response) {
  if (!response.ok) {
    throw new TypeError('Bad response status');
  }
  return cache.put(url, response);
})

Note: put() écrasera toute paire clé/valeur précedemment stockée en cache et qui correspond à la requête.

Note: Les implémentations initiales de Cache (à la fois dans Blink et Gecko) résolvent les promesses   Cache.add, Cache.addAll, et Cache.put quand le corps de la réponse est entièrement écrit en stockage.  Les versions plus récentes des spécifications sont plus précises en déclarant que le navigateur peut résoudre ces promesses dès que l'entrée est enregistrée en base de donnée, même si le reste de la requête est encore en train d'arriver.

Note: Depuis Chrome 46, l'API Cache ne stocke que les requêtes depuis des origines sécurisées, à savoir celles servies en HTTPS.

Syntaxe

cache.put(request, response).then(function() {
  // la paire requête/réponse a été ajoutée au cache
});

Paramètres

request
La Requête à ajouter au cache.
response
La Réponse à associer à la requête.

Retour

Une Promesse est retournée avec void.

Note: La promesse sera rompue avec un TypeError si le schéma d'URL n'est pas http ou https.

Exemples

Cet extrait de code est tiré du MDN sw-test example (lancez sw-test dans votre navigateur). On attend le déclenchement d'un FetchEvent, puis l'on va retourner une réponse spéciale d'après la procédure suivante :

  1. Vérifier si un match pour la requête a été trouvé dans le CacheStorage grâce à  CacheStorage.match() . Si oui, servir cette réponse.
  2. Sinon, ouvrir le cache v1 avec open(), insérer la requête réseau par défaut dans le cache via Cache.put() , et retourner un clone de cette requête avec return response.clone() — nécessaire car put() détruit le corps de la réponse.
  3. En cas d'échec (e.g., car le réseau est inaccessible), retourner une réponse de secours.
var response;
var cachedResponse = caches.match(event.request).catch(function() {
  return fetch(event.request);
}).then(function(r) {
  response = r;
  caches.open('v1').then(function(cache) {
    cache.put(event.request, response);
  });  
  return response.clone();
}).catch(function() {
  return caches.match('/sw-test/gallery/myLittleVader.jpg');
});

Spécifications

Spécification Statut Commentaire
Service Workers
La définition de 'Cache: put' dans cette spécification.
Version de travail Définition initiale.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung Internet
put
Expérimentale
Chrome Support complet 43
Notes
Support complet 43
Notes
Notes Requires HTTPS from version 46.
Edge Support complet 16Firefox Support complet 39
Notes
Support complet 39
Notes
Notes Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.
IE Aucun support NonOpera Support complet 30
Notes
Support complet 30
Notes
Notes Requires HTTPS from version 33.
Safari Support complet 11WebView Android Support complet 43
Notes
Support complet 43
Notes
Notes Requires HTTPS from version 46.
Chrome Android Support complet 43
Notes
Support complet 43
Notes
Notes Requires HTTPS from version 46.
Firefox Android Support complet 39Opera Android Support complet 30
Notes
Support complet 30
Notes
Notes Requires HTTPS from version 33.
Safari iOS Support complet 11Samsung Internet Android Support complet 4.0
Notes
Support complet 4.0
Notes
Notes Requires HTTPS from Samsung Internet 5.0.

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Voir les notes d'implémentation.
Voir les notes d'implémentation.

Voir aussi