Comment définir un cookie dans le navigateur…

Il est possible de définir un cookie dans le navigateur de plusieurs manières.

Via l'en-tête HTTP Set-Cookie du serveur. C'est la méthode principale pour définir un cookie, qui se produit côté serveur. Le serveur envoie à le navigateur l'en-tête Set-Cookie, qui indique au navigateur de sauvegarder une paire clé-valeur spécifique.

Exemple de réponse HTTP du serveur:
```
HTTP/1.1 200 OK
Content-Type: text/html
Set-Cookie: username=johndoe; Expires=Thu, 21 Dec 2023 12:00:00 GMT; Path=/; Secure; HttpOnly
Set-Cookie: settings=theme=dark&lang=en; Path=/
```
Paramètres de l'en-tête Set-Cookie:
- name=value: Nom et valeur du cookie. Paramètre obligatoire.
- Expires=<date>: Date et heure d'expiration du cookie. Si non spécifié, le cookie est de session et est supprimé à la fermeture du navigateur. Format de date - RFC 1123.
- Max-Age=<seconds>: Durée de vie maximale du cookie en secondes. Prend le pas sur Expires.
- Domain=<domain>: Domaine pour lequel le cookie est accessible. Par défaut, le domaine actuel (mais pas les sous-domaines).
- Path=<path>: Chemin sur le serveur pour lequel le cookie est accessible. Par défaut, le chemin racine /.
- Secure: Indicateur que le cookie doit être envoyé uniquement via HTTPS.
- HttpOnly: Indicateur que le cookie n'est pas accessible via JavaScript avec document.cookie. Protège contre les attaques XSS.
- SameSite=<mode>: Contrôle l'envoi du cookie lors de requêtes cross-site. Valeurs possibles: Strict, Lax (par défaut), None.

Via JavaScript côté client. Avec l'objet document.cookie, on peut lire, écrire et supprimer des cookies.

Écriture de cookie:

// Définir un cookie simple
document.cookie = "username=johndoe";

// Définir un cookie avec expires, path, secure et SameSite=Lax
const expiryDate = new Date();
expiryDate.setTime(expiryDate.getTime() + (30 * 24 * 60 * 60 * 1000)); // 30 jours
document.cookie = `token=abcdef123456; expires=${expiryDate.toUTCString()}; path=/; secure; SameSite=Lax`;

Lecture des cookies:

// document.cookie retourne une chaîne de tous les cookies accessibles au format "clé1=valeur1; clé2=valeur2; ..."
console.log(document.cookie);

Suppression de cookie: Pour supprimer un cookie, il faut le définir avec une date d'expiration dans le passé.

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/"; // Définir expires dans le passé

Il est important de préciser les mêmes paramètres path et domain (si ils ont été définis) que lors de la création. SameSite doit également correspondre pour une suppression correcte.

Avec des bibliothèques JavaScript tierces. Il existe des bibliothèques qui facilitent la gestion des cookies (par exemple, js-cookie). Elles offrent une API plus simple pour définir, obtenir et supprimer des cookies.

Exemple avec js-cookie:

// Inclure la bibliothèque
// <script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.1/dist/js.cookie.min.js"></script>

// Définir un cookie
Cookies.set('username', 'johndoe');

// Définir un cookie avec options
Cookies.set('token', 'abcdef123456', { expires: 30, path: '/', secure: true, sameSite: 'Lax' }); // expires en jours

// Obtenir des cookies
const username = Cookies.get('username'); // Retourne 'johndoe' ou undefined
const allCookies = Cookies.get(); // Retourne un objet avec tous les cookies

// Supprimer des cookies
Cookies.remove('username');
Cookies.remove('token', { path: '/' }); // Spécifier le path si il a été défini lors de la création

Comment définir un cookie dans le navigateur?