DOM HTML La propriété cookie 

Les navigateurs Web et les serveurs utilisent le protocole HTTP pour communiquer. Mais pour un site commercial, il est nécessaire de maintenir les informations de session entre les différentes pages.
Par exemple, l’enregistrement d’un utilisateur devrait se terminer après avoir parcouru un nombre de pages.
Mais comment faire pour maintenir les informations de session utilisateur à travers toutes les pages web ?
Dans de nombreuses situations, l’utilisation des cookies est la méthode la plus efficace pour se souvenir et suivre les préférences, les achats, les commissions et plein d’autres informations requises pour une meilleure expérience du visiteur ou des statistiques du site.
pour apprendre plus sur les cookies voir notre tutoriel sur les cookies

Définition et utilisation propriété cookie 

JavaScript cours tutorial

La propriété cookie définit ou retourne toutes les paires nom/valeur des cookies du document actif.

Exemple : Retourner les cookies associés avec le document en cours :

Sélectionner le code

  <!doctype html>
  <html lang="fr">
  <head>
           <meta charset="UTF-8">
           <title>Exemple les cookies associés à un document</title>
  </head>
  <body>
     
  <p id="dmo">Cliquez sur le bouton pour retourner les cookies associés au
  document actif.</p>
   
  <button onclick="maFonction()"> Voir </button>
   
  <script>
  function maFonction()
  {
  if(document.cookie!="") document.getElementById("dmo").innerHTML="Les cookies
  associés avec ce document sont : " + document.cookie;
  else document.getElementById("dmo").innerHTML="Aucun cookie n'est associés avec ce
  document";
  }
  </script>
  </body>
  </html>

 

Appui de navigateur

Internet Explorer Firefox Opera Google Chrome Safari

La propriété de cookie est prise en charge dans tous les principaux navigateurs.

Syntaxe

document.cookie

 vous avez besoin d'utiliser des cookies sur une page web, pour se faire vous aurez besoin de :

  • une fonction qui lit le cookie  
  • une fonction qui stocke le cookie
  • une fonction qui supprime le cookie

Exemple fonctions pour manipuler les cookies

Sélectionner le code

  <script>
  /* Tout d'abord, nous vérifions pour voir s'il y a un cookie stocké.
   Si non, la longueur de document.cookie serait nul.*/
  // fonction pour lire le cookie.
  function getCookie(NameOfCookie)
  { if (document.cookie.length > 0)
  /* Deuxième nous vérifions pour voir si le nom du cookie est stocké dans la propriété
   « document.cookie » de la page.
   Si le nom de notre cookie n'est pas présent la valeur -1 est stockée
  dans la variable nommée « commencer ».*/
  { var commencer = document.cookie.indexOf(NameOfCookie+"=");
  /* Si notre cookie a été défini.
   La valeur stockée dans le cookie est retournée par notre fonction.*/
  if (commencer != -1)
  { commencer += NameOfCookie.length+1;
  fin = document.cookie.indexOf(";", commencer);
  if (fin == -1) fin = document.cookie.length;
  return unescape(document.cookie.substring(commencer, fin)); }
  }
  /* Si notre cookie n'a pas été défini.
   La valeur « null » est retournée par la fonction. */
  return null;
  }
   
  //Fonction pour définir le cookie.
  /*  Trois variables sont utilisées pour définir le nouveau cookie.
   Le nom du cookie, la valeur qui doit être stockés,
   et enfin le nombre de jours que le cookie doir rester dans le pc du client avant
  d'expirer.
   Les premières lignes de la fonction convertissent  le nombre de jours en une date
  valide. */
  function setCookie(NomDuCookie, valeur, expiredays)
  { var ExpireDate = new Date ();
  ExpireDate.setTime(ExpireDate.getTime() + (expiredays * 24 * 3600 * 1000));
  /* La ligne suivante stocke le cookie, simplement en assignant les valeurs à l'objet
  « document.cookie ». */
  document.cookie = NomDuCookie + "=" + escape(valeur) + ((expiredays == null) ? "" :
  "; expires=" + ExpireDate.toGMTString());
  }
   
  //Fonction pour suprimer le cookie
  /*  La fonction vérifie simplement si le cookie est défini.
   Si oui, on met la date d'expiration à la valeur du 1er janvier 1970 par exemple. */
  function delCookie (NomDuCookie)
  { if (getCookie(NomDuCookie)) {
  document.cookie = NomDuCookie + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT";
  }
  }
  </script>

 

Pour plus de détails voir aussi les cookies

Par carabde 30 mars 2014