Créer un cookie en Javascript

Les cookies sont la seule solution pour stocker des informations de manière permanente sur le poste de l’internaute. La plupart des sites en font l’usage.

Le but de stocker des informations sur le poste de l’utilisateur est de pouvoir les exploiter lors des prochaines visites du visiteur à des fins de confort de navigation.

Les données enregistrées sont écrites sur un fichier texte (.txt).

Un navigateur peut enregistrer plusieurs cookies par site dans la limite d’environ 3KO au total (pour un nom de domaine).

L’utilisateur ayant peut-être désactivé les cookies dans son navigateur, on ne peut donc pas les utiliser de manière fiable pour certaines applications.

Ecrire un cookie

Malheureusement, javascript ne dispose pas de méthode native pour l’utilisation des cookies.
Il est donc à chaque fois nécessaire de redéfinir les fonctions d’exploitation du cookie.

Pour créer un cookie, nous utilisons (ou plutôt nous nommerons) la fonction setCookie(). Suivez le guide:

   function setCookie(nom, valeur, expire, chemin, domaine, securite){
     document.cookie = nom + ' = ' + escape(valeur) + '  ' +
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) +
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) +
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) +
               ((securite == true) ? '; secure' : '');
   }

Explications

La fonction setCookie() attend les 2 premiers paramètres obligatoires nom et valeur qui représentent le nom et la valeur du cookie.

Pour déclarer le nom du cookie, nous éviterons l’utilisation de caractères spéciaux.
Pour gérer ceux qui seraient éventuellement présents dans sa valeur, nous appliquons la méthode espace().

Le paramètre expire est un objet de type date et n’est pas obligatoire. D’ailleurs, à part les 2 premiers paramètres, aucun n’est obligatoire. Il est cependant conseillé de les renseigner pour pouvoir exploiter le cookie là ou l’on en aura besoin.
Si ce paramètre est renseigné, la date d’expiration du cookie aura cette valeur. Sinon, le cookie sera détruit à la fin de la session.

Le paramètre chemin définit le chemin du cookie. Afin de pouvoir exploiter le cookie sur l’ensemble d’un site (dans l’ensemble des répertoires), il faut lui donner la valeur ‘ / ‘.
Si sa valeur est nulle ou non renseignée, le cookie sera configuré avec l’url de la page.

Le paramètre domaine définit le domaine du cookie.

Enfin, le paramètre securite devra être égal à true si le cookie est prévu pour les connexions sécurisées par https.

Dans cet exemple, nous avons utilisé l’opérateur ternaire pour tester la valeur des différents paramètres. Ils permettent entre autre d’obtenir un code plus compact.

Appel de la fonction setCookie()

Voici un exemple complet de création d’un cookie en javascript:

   function setCookie(nom, valeur, expire, chemin, domaine, securite){
     document.cookie = nom + ' = ' + escape(valeur) + '  ' +
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) +
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) +
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) +
               ((securite == true) ? '; secure' : '');
   }

   var dtExpire = new Date();
   dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);

   // dtExpire est un objet de type date.
   // On le définit tout d'abord à la date et heure du jour
   // Puis on lui ajoute 3600 secondes (3600 millisecondes * 1000) soit une heure
   // La date d'expiration du cookie est donc programmée pour une heure après sa création
   // Cela signifie qu'une heure après sa création,
   // ce cookie ne sera plus accessible en lecture comme en écriture
   // Il sera tout simplement supprimé

   setCookie('myCookie', 'développement web', dtExpire, '/' );

   // Ici, le cookie aura
   // pour nom : myCookie
   // pour valeur : développement web
   // pour date d'expiration : 1 heure
   // pour accessibilité : l'ensemble du site

L’article suivant montre comment lire un cookie en Javascript.