Fiche Javascript : Les cookiesObjet de la ficheÉtat de la fiche
| ||||||||||||||||||
| Déverrouillez les cookies | |
| Internet explorer 7, 6 | Firefox 2.x.x.x |
|
|
A quoi ça sert ?
Lorsque vous visitez par exemple un site commercial il peut arriver que l'on vous demande dans un formulaire votre nom, votre adresse mail etc., Lorsque vous retournez sur ce site vous risquez de trouver un accueil personnalisé comme par exemple "Bonjour M Dupont" et être aiguillez directement sur une page présentant les produits sur lesquels vous vous êtes le plus attardé lors de votre dernière visite. Pourquoi : car lors de votre première visite le site consulté a stocké sur votre disque dur un petit fichier contenant diverses informations. Lors de vos visites ultérieures le site consulté vient récupérer ce petit fichier fichier et utilise les informations pour vous "faciliter la navigation" !...
Les exemples les plus classiques d'utilisation des cookies sont:
- Les compteurs de visite,
- l'orientation des visiteurs vers leurs pages préférées,
- la mémorisation des mots de passe et données d'un formulaire pour éviter leur ressaisie,
- la gestion d'événements comme l'ouverture ou non d'une fenêtre popup,
- l'affichage de pages personnalisées,
- le passage de données d'une page à l'autre,
- la gestion du contenu des caddies dans les sites de commerce électronique.
Ou sont-ils stockés?
Le navigateur Internet Explorer les stocke habituellement dans le répertoire C:\WINDOWS\COOKIES\ ou dans le dossier C:\WINDOWS\PROFILES\Utilisateur\COOKIES\ lorsque plusieurs utilisateurs utilisent la même machine.
Comment ça marche
- L'utilisateur (1) renseigne l'URL du document HTML (5) (fichier texte contenant du HTML et du Javascript (6)) dans son navigateur (2).
- Lorsque le document est atteint via Internet (3), ce dernier est téléchargé vers le navigateur (2) de l'utilisateur.
- On travaille maintenant uniquement sur le poste de travail de l'utilisateur
Le navigateur (2) va analyser le fichier , afficher le contenu de manière structuré et exécuter le code javascript.
Si le code javascript est écrit pour inscrire un cookie, le navigateur (2) va accéder au disque dur de l'utilisateur et créer un petit fichier texte contenant les informations prévues par le concepteur du document (6). Ces informations sont disponibles et peuvent être consultées par les pages web du site au fur et à mesure des consultations.
Les attributs d'un cookie:
Syntaxe
Javascript utilise la propriété cookie de l'objet document . La syntaxe générale d'inscription d'un cookie est la suivante :
document.cookie="Nom du cookie = Valeur du cookie;expires=la date d'expiration;path=le chemin d'accès;domain=le domaine de validité;l'attribut de sécurité"
Nom et valeur (nom=valeur):
Le nom permet d'identifier le cookie. Sa valeur est un texte qui constitue le contenu du cookie. Attention, la valeur d'un cookie ne doit contenir aucun "espace", virgule ou point-virgule.
Date d'expiration (expires=date au format GMT):
Au format GMT (ex: Tue, 31-Dec-2002 08:00:00 GMT), elle est facultative. Si elle est omise, le cookie "meurt" à la fin de la session en cours du navigateur. Si elle est spécifiée on parle d'un "cookie persistant".
Chemin d'accès (path=chemin accès):
Il indique la partie de l'URL pour laquelle le cookie est valable.
Une page HTML pourra lire les cookies uniquement de ses surrépertoires jusqu'à la racine du site:
ex: path='/Tutoriaux/JVS/JVS_Cookies.htm/' lira les cookies du répertoire
http://monwebfacile/Tutoriaux, mais ne pourra pas lire les cookies de ses
sous répertoires comme par exemple http://monwebfacile/Tutoriaux/JVS/Images.
Pour qu'un cookie soit accessible par toutes les pages d'un site (donc depuis tous les répertoires), il faudra spécifier path="/".
Si le chemin d'accès est omis, il prendra la valeur par défaut du chemin de la page qui a écrit le cookie.
Domaine de validité (domain=domaine de validité):
Il indique le serveur pour lequel le cookie est valable (ex: monwebfacile.free.fr). S'il n'est pas spécifié il prend la valeur par défaut du domaine de la page HTML qui écrit le cookie, ce qui est, dans la grande majorité des cas, l'effet recherché.
Pour des raisons de sécurité, il n'est pas possible qu'un site web place des cookies qui seront relus par un autre site.
Attribut de sécurité (secure):
Prend la valeur true ou false. Si cet attribut est true le cookie ne sera transmis que si la connexion vers le serveur est sécurisée (protocole HTTPS et non plus HTTP).
Écrire un cookie
Le code proposé est sous forme de fonction qui peut être appelée à partir de n'importe ou dans la page HTML par la syntaxe : EcrireCookie(nom cookie, valeur cookie, date d'expiration, répertoire, domaine d'application, sécurité);
Remarques sur le code
- Il faut fournir à la fonction au moins les paramètres _nom et _valeur à la fonction EcrireCookie : EcrireCookie('Test','MartineJany',null,null,null,false);
- Si l'on désire paramétrer une date d'expiration l'appel à la fonction se fera de la manière suivante : EcrireCookie('Test','MartineJany',date,null,null,false); avec le paramètre date initialisé au format UTC à la date courante (date=new Date;) plus x jour(s) (date.setDate(date.getDate()+x);).
- La commande finale de document.cookie est stockée dans la variable cookie_string.
- escape(_valeur) est une fonction javascript qui permet de s'affranchir d'erreur de caractère dans le paramètre _valeur en convertissant un caractère spécial ou chaque caractère spécial d'une chaîne de caractères en une chaîne contenant "%" + le code ASCII du caractère en hexadécimal. Par exemple escape('hello bonjour - comment ; allez , vous') sera converti en la chaîne de caractères suivante : hello%20bonjour%20-%20comment%20%3B%20allez%20%2C%20vous afin de ne pas transmettre de caractères interdits.
- Le paramètre _expiresDate doit être un format de date normalisé UTC. Par exemple la valeur renvoyée par new Date - est de la forme Tue Jan 1 01:00:00 UTC+0100 2008 . date.setDate(date.getDate()+1) permet de rajouter 1 jour à la variable date tout en conservant cette dernière au format UTC.
-
_expiresDate.toGMTString() va convertir le contenu de _expiresDate en une date au format GMT strict, seul format normalisé pour déterminer la durée de vie d'un cookie.
Par exemple .toGMTString() appliqué à la valeur Tue Jan 1 01:00:00 UTC+0100 2008 donnera : 2008Tue, 1 Jan 2008 00:00:00 UTC .
Lire les cookies
Lire tous les cookies concernés par le domaine et présents dans votre ordinateur.
Syntaxe
var cookiesDeCeDomaine = document.cookie
<p><Cliquez<a title="Les cookies de ce domaine" href="" onclick="javascript:alert(document.cookie);return false;"> ICI </a>pour lire les cookies présents.</p>
Lire un cookie particulier.
Le code est sous forme de fonction qui peut être appelée à partir de n'importe ou dans la page HTML par la syntaxe : LireCookie(nom cookie);
Remarques sur le code
- document.cookie renvoi s'ils existe une chaîne de caractères avec tous les cookies : nom et valeur de chacun d'eux. Les informations de chaque cookie sont séparées par un ;
- Par exemple document.cookie = "Tuto=Page%20HTML; Test=MartineJany" et recherchons le contenu du cookie Test.
- Si document.cookie n'est pas vide on vérifie par document.cookie.indexOf( _nom) que la chaîne de caractères renvoyée par document.cookie contient une chaîne correspondant au contenu de la variable _nom passée à la fonction. La valeur retournée (index) correspond au début de la chaîne recherchée. Dans notre exemple : 18 (emplacement du T de Test).
- Si on trouve une occurrence (index != -1) on position la variable nDeb au début du contenu du cookie recherché. Dans notre exemple 23 (emplacement du M de MartineJany).
- La variable nfin va donner l'emplacement du séparateur de fin du cookie considérée. Si le séparateur n'existe pas (dernier cookie de la liste) on utilise l'emplacement du dernier caractère de la liste. Dans notre exemple 34.
- Le résultat renvoyé est la chaîne de caractères comprise entre l'emplacement 23 et l'emplacement 34. Dans notre exemple MartineJany. Sur ce résultat on applique la fonction unescape() pour restaurer les caractères spéciaux qui avaient été modifiés lors de l'inscription du cookie.
- La fonction sur demande du contenu du cookie test va renvoyé MartineJany. Si le cookie n'est pas trouvé la fonction retourne null.
Effacer un cookie
Pour effacer un cookie il suffit de le réécrire avec une valeur nulle et une date d'expiration antérieure à celle précédemment initialisée. On va donc réutiliser la fonction EcrireCookie() décrite précédemment. Pour effacer efficacement un cookie il faut:
- lui donner la valeur null,
- lui donner une date d'expiration située dans le passée. La raison pour laquelle les deux actions sont nécessaires tient au fait que la date d'expiration ne sera modifiée qu'à la fermeture du navigateur. Attribuer la valeur null au cookie permet de le tester correctement pendant la session du navigateur en cours, et revient donc à l'effacer virtuellement.
Attention : si le cookie a été écrit avec un path et/ou un domain déterminé, il ne pourra être détruit qu'en précisant la valeur du path, et/ou du domaine spécifié lors de sa création.
Entraînez vous aux cookies
 Avant de commencer, testez l'acceptation des cookies par votre navigateur en cliquant sur la petite galette :  |
|
Liste des cookies présent pour ce domaine |
|
| Effacer tous les cookies | |
Application au projet de site web
