Qu'est-ce que Cache-Control ? Le cache expliqué

Le contrôle du cache dicte le comportement de mise en cache d'un site web, en permettant aux navigateurs de savoir à quelle fréquence actualiser les ressources stockées localement.

Share facebook icon linkedin icon twitter icon email icon

Cache-Control

Objectifs d’apprentissage

Après avoir lu cet article, vous pourrez :

  • Définir le contrôle du cache
  • Décrire la mise en cache du navigateur
  • Décrire plusieurs directives de contrôle du cache

Qu'est-ce que Cache-Control ?

Cache-Control est un en-tête du protocole HTTP qui dicte le comportement de mise en cache du navigateur. En bref, lorsque quelqu'un visite un site web, son navigateur enregistre certaines ressources, telles que des images et des données de site web, dans un lieu de stockage appelé cache. Lorsque cet utilisateur revisite le même site web, Cache-Control définit les règles qui déterminent si cet utilisateur aura ces ressources chargées à partir de son cache local, ou si le navigateur devra envoyer une requête au serveur pour obtenir de nouvelles ressources. Pour mieux comprendre cache-control, il est nécessaire d'avoir une compréhension de base de la mise en cache du navigateur et des en-têtes HTTP.

Qu'est-ce que la mise en cache du navigateur ?

Comme expliqué ci-dessus, la mise en cache du navigateur intervient lorsqu'un navigateur web enregistre les ressources du site web pour ne pas avoir à les récupérer à nouveau à partir d'un serveur. Par exemple, une image d'arrière-plan sur un site web peut être enregistrée localement dans le cache, ainsi lorsqu'un utilisateur visite cette page pour la deuxième fois, l'image se charge à partir des fichiers locaux de l'utilisateur et la page se charge beaucoup plus rapidement.

Les navigateurs ne stockent ces ressources que pendant une période de temps spécifiée, c'est-à-dire une durée de vie connue sous le nom Time To Live (TTL). Si un utilisateur demande une ressource mise en cache après l'expiration du TTL, le navigateur devra à nouveau contacter le serveur et télécharger une nouvelle copie de la ressource. Comment les navigateurs et les serveurs web connaissent-ils le TTL pour chaque ressource ? C'est là que les en-têtes HTTP entrent en jeu.

Qu'est-ce que des en-têtes HTTP ?

Le protocole de transfert hypertexte (HTTP) décrit la syntaxe des communications sur le World Wide Web, et cette communication se compose des requêtes des clients aux serveurs et des réponses des serveurs aux clients. Ces requêtes et réponses HTTP sont chacune accompagnées d'une série de paires clé-valeur appelées en-têtes.

Ces en-têtes contiennent de nombreuses informations importantes sur chaque communication. Par exemple, un en-tête de requête contient généralement les informations suivantes :

  1. Informations sur la ressource demandée
  2. Le navigateur utilisé par le client
  3. Le format de données que le client accepte

Les en-têtes de réponse contiennent souvent les informations suivantes :

  1. Si la requête a été satisfaite ou non
  2. La langue et le format des ressources dans le corps de la réponse.

Un en-tête Cache-Control peut apparaître à la fois dans les requêtes et les réponses HTTP.

Que contient un en-tête Cache-Control ?

Les en-têtes sont constitués de paires clé-valeur séparées par deux points. Pour le contrôle du cache, la « clé », ou la partie à gauche des deux points, est toujours « Cache-Control ». La « valeur » est ce qui se trouve à droite des deux points. Il peut s'agir d'une ou de plusieurs valeurs séparées par des virgules pour le contrôle du cache.

Example Cache Control Header

Ces valeurs sont appelées directives. Elles déterminent qui peut mettre en cache une ressource ainsi que la durée pendant laquelle ces ressources peuvent être mises en cache avant d'être mises à jour. Ci-dessous, nous passons en revue certaines des directives de contrôle du cache les plus courantes :

« cache-control: private »

Une réponse avec une directive « private » ne peut être mise en cache que par le client et jamais par un agent intermédiaire, tel qu'un CDN ou un proxy. Il s'agit souvent de ressources contenant des données privées, comme un site web affichant les informations personnelles d'un utilisateur.

« cache-contrôle: public »

À l'inverse, la directive « public » signifie que la ressource peut être stockée par n'importe quel cache.

« Cache-Control: no-store »

Une réponse avec une directive « no-store » ne peut jamais être mise en cache, à quelque endroit que ce soit. Cela signifie que chaque fois qu'un utilisateur demande ces données, une requête doit être envoyée au serveur d'origine pour obtenir une nouvelle copie. Cette directive est généralement réservée aux ressources qui contiennent des données extrêmement sensibles, telles que les informations de compte bancaire.

« cache-control: no-cache »

Cette directive signifie que les versions mises en cache de la ressource demandée ne peuvent pas être utilisées sans vérifier au préalable s'il existe une version mise à jour. Cela se fait généralement à l'aide d'un ETag.

Un ETag est un autre en-tête HTTP qui contient un jeton unique correspondant à la version de la ressource au moment où elle a été demandée. Ce jeton est modifié sur le serveur d'origine à chaque mise à jour de la ressource.

Lorsqu'un utilisateur revient sur une page avec une ressource « no-cache », le client devra toujours se connecter au serveur d'origine et comparer l'ETag de la ressource mise en cache avec la ressource du serveur. Si les ETags sont identiques, la ressource mise en cache sera fournie à l'utilisateur. Sinon, cela signifie que la ressource a été mise à jour et que le client devra télécharger une nouvelle version pour la fournir à l'utilisateur. Ce processus garantit que l'utilisateur obtient toujours la version la plus récente de cette ressource sans nécessiter de téléchargements inutiles.

« cache-control: max-age »

Cette directive dicte la durée de vie, en d'autres termes combien de secondes une ressource peut être servie à partir du cache après son téléchargement. Par exemple, si l'âge maximum est défini sur 1800, cela signifie que pendant 1800 s (30 min) après la première demande de la ressource au serveur, l'utilisateur recevra une version mise en cache de cette ressource lors des demandes suivantes. Si l'utilisateur demande à nouveau la ressource après l'expiration de ces trente minutes, le client devra demander une nouvelle copie au serveur d'origine.

La directive « s-maxage » est spécifiquement destinée aux caches partagés tels que les CDN, et détermine la durée pendant laquelle ces caches partagés peuvent continuer à servir la ressource à partir du cache. Cette directive remplace la directive « max-age » pour les clients individuels.

Pourquoi le contrôle du cache est-il important ?

La mise en cache du navigateur est un excellent moyen de préserver les ressources et d'améliorer l'expérience utilisateur sur Internet, mais sans l'en-tête cache-control, elle serait très fragile. Chaque ressource sur chaque site serait liée par les mêmes règles de mise en cache, ce qui signifie que les informations sensibles seraient mises en cache de la même manière que les informations publiques, et les ressources fréquemment mises à jour seraient mises en cache pendant la même durée que celles qui changent rarement.

Cache-Control apporte la flexibilité qui rend la mise en cache du navigateur vraiment utile, en permettant aux développeurs de déterminer comment chaque ressource sera mise en cache. Il permet également aux développeurs de définir des règles spéciales pour les intermédiaires, ce qui explique pourquoi les sites qui utilisent un CDN, comme Cloudflare CDN , ont tendance à mieux fonctionner que les sites qui ne le font pas.