Cache.put()
===========

**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 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 :


```js
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
-------


```js
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.


```js
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
--------------

| Specification |
| --- |
| Service Workers # cache-put |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Utiliser les Service Workers
* `Cache`
* `caches`