Expliquez la différence entre cookies, sessionStorage et localStorage.

Les cookies stockent de petites quantités d'informations textuelles (jusqu'à 4 Ko) côté client, envoyées avec chaque requête HTTP au domaine qui les a définies. Elles peuvent avoir une date d'expiration. Utilisées pour l'authentification, le suivi des utilisateurs, la sauvegarde des préférences.

localStorage stocke des données sans date d'expiration (jusqu'à ce que l'utilisateur efface le stockage ou ferme le navigateur) côté client (jusqu'à 5-10 Mo selon le navigateur). Les données sont accessibles entre les sessions du navigateur, mais uniquement pour les scripts du même origine (domaine, protocole, port). Non envoyées automatiquement avec les requêtes HTTP. Utilisé pour le stockage à long terme et la configuration de l'application.

sessionStorage stocke des données pendant une session du navigateur (tant que l'onglet ou la fenêtre sont ouverts). Les données sont supprimées à la fermeture de l'onglet ou de la fenêtre. La capacité de stockage est similaire à localStorage (jusqu'à 5-10 Mo). Les données sont également accessibles uniquement pour les scripts du même origine. Non envoyées automatiquement avec les requêtes HTTP. Utilisé pour le stockage temporaire de données spécifiques à la session en cours.

Caractéristique	Cookies	localStorage	sessionStorage
Durée de stockage	Date d'expiration ou fermeture du navigateur	Jusqu'à ce que l'utilisateur ou l'application les supprime	Tant que l'onglet ou la fenêtre sont ouverts
Taille des données	Jusqu'à 4 Ko	Jusqu'à 5-10 Mo	Jusqu'à 5-10 Mo
Accessibilité	Envoyées avec les requêtes HTTP au domaine	Seulement via JavaScript du même origine	Seulement via JavaScript du même origine
Accessibilité entre onglets	Oui	Oui	Non (pour différents onglets)
Objectif	Authentification, suivi, préférences	Stockage à long terme, paramètres	Stockage temporaire dans la session

Exemple d'utilisation de localStorage:

// Enregistrer des données
localStorage.setItem('userName', 'Alice');

// Récupérer des données
const userName = localStorage.getItem('userName');
console.log(userName); // Résultat : Alice

// Supprimer des données
// localStorage.removeItem('userName');

// Effacer tout le stockage
// localStorage.clear();

Exemple d'utilisation de sessionStorage:

// Enregistrer des données
sessionStorage.setItem('orderId', '12345');

// Récupérer des données
const orderId = sessionStorage.getItem('orderId');
console.log(orderId); // Résultat : 12345

// Supprimer des données
// sessionStorage.removeItem('orderId');

// Effacer tout le stockage
// sessionStorage.clear();