Le Web est conçu de sorte que chaque requête d'un navigateur Web à un site Web soit distincte. Par conception, le Web n'a pas de "mémoire". Chaque fois que vous ouvrez une page Web, le site Web que vous consultez ne peut pas se souvenir des informations de votre dernière session. Cela permet de rendre le Web efficace, car il n'est pas nécessaire de mettre en place un mécanisme pour suivre les requêtes et les réponses.
Mais la nature oublieuse du Web pose également un problème. Par exemple, comment un panier d'achat peut-il fonctionner si le site Web sur lequel vous vous trouvez ne se souvient pas de ce que vous venez d'y mettre ?
Les cookies ont été inventés pour résoudre ce problème.
Les cookies permettent aux sites Web de mémoriser des informations
Lorsque vous consultez une page sur un site Web, votre navigateur Web envoie des requêtes au serveur du site Web pour obtenir les ressources incluses sur la page, telles que le code HTML, CSS, JavaScript ou les images.
Les navigateurs Web et les sites Web interagissent en suivant le protocole HTTP. Il s'agit d'un ensemble de règles standardisées pour la communication.
En réponse à une requête HTTP pour une ressource, le serveur du site Web peut inclure des informations supplémentaires appelées en-têtes avec la ressource elle-même. Un en-tête Set-Cookie
inclus dans une réponse HTTP indique à votre navigateur de stocker du texte (un nom et une valeur). C'est ce qu'on appelle un cookie. Par exemple, l'en-tête de réponse Set-Cookie: cat=tabby
indique à votre navigateur de stocker un cookie avec le nom "cat" et la valeur "tabby".
Une fois ce cookie défini, les requêtes ultérieures de votre navigateur au site Web incluront l'en-tête Cookie: cat=tabby
. Le serveur du site Web peut accéder au cookie à partir de l'en-tête de la requête et utiliser la valeur.
Fonctionnement des cookies : étape par étape
Imaginez que vous consultez le site Web cats.example
. Le site souhaite vous montrer une image aléatoire de chat et conserver un enregistrement du chat qui vous a été présenté.
Les étapes suivantes expliquent comment procéder avec les cookies.
1. Le navigateur demande un fichier
Vous accédez à la page d'accueil du site Web cats.example
.
Une fois que votre navigateur a traité le code HTML de la page d'accueil, il demande les fichiers de la page, y compris cat.jpg
depuis cats.example
.
2. Le serveur du site Web répond
Le serveur à l'adresse cats.example
répond avec le fichier image cat.jpg
.
Avec la réponse, le serveur inclut un en-tête : Set-Cookie: cat=tabby
.
3. Le navigateur reçoit la réponse
Votre navigateur reçoit le fichier image et traite l'en-tête Set-Cookie: cat=tabby
inclus.
Un cookie est stocké : nom cat
, valeur tabby
.
4. Le navigateur envoie des requêtes supplémentaires
Désormais, votre navigateur inclut l'en-tête Cookie: cat=tabby
dans les requêtes envoyées à cats.example
.
Lorsque le serveur Web cats.example
reçoit une requête, il peut traiter le cookie et faire ce qu'il veut avec cette valeur, par exemple s'assurer de ne pas vous renvoyer la même image de chat tigré.
Voici le processus complet des cookies :
- Votre navigateur envoie une requête pour un fichier au serveur d'un site Web.
- Le serveur peut inclure un en-tête tel que
Set-Cookie: cat=tabby
avec le fichier qu'il envoie en réponse à la requête. - Lorsque votre navigateur reçoit la réponse, il stocke le cookie.
- À chaque requête suivante, votre navigateur envoie le cookie au serveur dans un en-tête
Cookie: cat=tabby
.
Accéder aux cookies avec JavaScript
L'exemple précédent utilise l'en-tête de réponse Set-Cookie
pour définir un cookie.
Vous pouvez également créer des cookies avec JavaScript à l'aide de la méthode document.cookie
.
Essayez la démo : javascript-cookie.glitch.me.
En savoir plus : Document : propriété cookie
Pourquoi avons-nous besoin de cookies ?
En 1994, l'ingénieur Lou Montulli travaillait chez Netscape, une entreprise de logiciels qui a ensuite créé le navigateur Web le plus populaire du milieu des années 1990.
Pendant ce temps, une entreprise de télécommunications, MCI, tentait de créer un panier pour l'une des premières boutiques en ligne au monde. MCI a contacté Montulli pour lui expliquer son problème. Montulli a répondu en ajoutant une fonctionnalité à HTTP qui permettait à un site de stocker une petite quantité de texte sur le navigateur Web d'un utilisateur, un nom et une valeur : quelque chose comme cart-id=123
. Il l'a appelé "cookie", car à l'époque, les programmeurs utilisaient l'expression "cookie magique" pour désigner un petit élément d'information supplémentaire inclus dans la communication de données.
Montulli a terminé son travail sur les cookies HTTP en moins d'une semaine. Il ne se doutait pas que les cookies seraient essentiels pour la publicité, la connexion, les paiements, la détection des fraudes et d'autres fonctionnalités critiques de la plate-forme Web. Les cookies sont une technologie apparemment simple qui a eu des effets secondaires considérables.
Utilisations des cookies
Les cookies permettent au navigateur de stocker une petite quantité d'informations sur l'utilisateur, afin de "mémoriser" quelque chose pour plusieurs requêtes. Les cookies ont plusieurs utilisations :
- Gestion des sessions
Permet à un site Web de reconnaître un utilisateur, par exemple pour maintenir un état connecté sur différentes pages. - Personnalisation
Stockez les préférences des utilisateurs, comme la langue, le thème ou les éléments récemment consultés, pour personnaliser l'expérience sur le site Web. - Suivi
Historiquement, les cookies ont été utilisés pour suivre le comportement des utilisateurs sur les sites Web, pour la publicité ciblée et d'autres cas d'utilisation.
Les cookies sont principalement utilisés pour les identifiants, plutôt que pour stocker directement des informations.
Par exemple, un cookie pour votre panier sur une animalerie en ligne ne listera pas les produits, mais fournira plutôt un ID de compte qui permettra à l'animalerie de rechercher le contenu de votre panier dans son stockage de données côté serveur.
Une requête envoyée au serveur de l'animalerie peut inclure un en-tête de cookie comme celui-ci :
Cookie: _cart=CART1.2.34567890.123456789
Le serveur peut ensuite rechercher le compte _cart
dans son datastore et inclure d'autres informations sur la demande.
En savoir plus
- Attributs des cookies
- Que sont les cookies tiers ?
- Requête et réponse HTTP
- Outils pour les cookies
- Démonstrations de cookies
- Utiliser des cookies HTTP
- The Magic Cookie: How Lou Montulli cured the Web's amnesia
- Cookies HTTP (spécification d'origine)
- Cookies HTTP, ou comment ne pas concevoir de protocoles