Surfer identifié
Permettre une navigation personnalisée

Il est parfois agréable et souvent utile de pouvoir s'identifier sur un site afin d'avoir une navigation personnalisée qui réponde à certains critères exprimés lors de l'inscription. Nous allons explorer les différentes possibilités qui s'offrent à nous avec les langages vus précédemment :

 Les cookies 

Un cookie est un tout petit fichier texte sauvegardé sur le disque dur du visiteur et qui contient quelques informations textuelles comme un login et parfois un mot de passe. Chaque cookie à une durée de vie limitée, fixée par son créateur (le site visité). Attention, les données des cookies ne sont pas cryptées, ce qui n'est a priori pas grave puisqu'il s'agit de l'ordinateur personnel du visiteur mais qui peut s'avérer dangereux s'il utilise un ordinateur public. Il faut donc toujours proposer l'utilisation d'un cookie et ne pas prendre cette décision seul ! Les internautes ont d'ailleurs bien compris que certains cookies sont nuisibles (de leur point de vue), et il n'est donc pas rare que leur utilisation soit interdite par nombre d'entre eux. Les cookies ne doivent donc constituer qu'un élément optionnel de confort et un site ne doit jamais s'appuyer sur un postulat d'existence du cookie souhaité.

function SetCookie(nom, valeurs)
// Crée (ou modifie) un cookie
// nom doit être distinctif
// valeurs est une chaine de valeurs séparées par des virgules
// d'autres paramètres sont optionnels :
//  * expires : durée de vie en millisecondes
//  * path : chemin du cookie
//  * domain : domaine du site
//  * secure : sécurisé ou pas
// La commande d'utilisation complète est donc :
//   SetCookie(monCookie, valeurs, null, "/monChemin", null, true);
{
  var argv = SetCookie.arguments;
  var argc = SetCookie.arguments.length;
  var expires = (argc > 2) ? argv[2] : null;
  var path = (argc > 3) ? argv[3] : null;
  var domain = (argc > 4) ? argv[4] : null;
  var secure = (argc > 5) ? argv[5] : false;
  document.cookie = nom + "=" + escape(valeurs) +
    ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
    ((path == null) ? "" : ("; path=" + path)) +
    ((domain == null) ? "" : ("; domain=" + domain)) +
    ((secure == true) ? "; secure" : "");
}

function getCookieVal(offset)
// fonction utilisée par getCookie()
{
  var endstr = document.cookie.indexOf (";", offset);
  if (endstr == -1)
    endstr = document.cookie.length;
  return unescape(document.cookie.substring(offset, endstr));
}

function GetCookie(nom)
// recherche un cookie et renvoie un tableau des valeurs si le cookie existe, null sinon
{
  var arg = nom + "=";
  var alen = arg.length;
  var clen = document.cookie.length;
  var i = 0;
  while (i < clen)
  {
    var j = i + alen;
    if (document.cookie.substring(i, j) == arg)
      return getCookieVal(j).split(/,/);
    i = document.cookie.indexOf(" ", i) + 1;
    if (i == 0)
      break; 
  }
  return null;
}

function DeleteCookie(nom)
// pour détruire un cookie, on met sa date d'expiration à la date courante
{
  var exp = new Date();
  exp.setTime (exp.getTime() - 1);
  var cval = GetCookie (nom);
  if (cval != null)
    document.cookie = nom + "=" + cval + "; expires=" + exp.toGMTString();
}

function ExpiresDays(jours)
{
  var date = new Date();
  date.setTime(date.getTime() + (jours * 24 * 3600 * 1000));
  return date;
}

 Les variables en ligne 

en travaux ...

 Les sessions PHP 

en travaux ...

 Le compromis idéal 

En pratique, il vaut mieux ne pas recourir à l'utilisation de variables en ligne lorsque cela est possible. On utilise en priorité les sessions PHP qui offrent l'avantage de la souplesse et de l'indépendance vis-à-vis des choix des utilisateurs quant à leur politique concernant JavaScript et les cookies. Cependant, ceci implique que les utilisateurs s'identifient chaque fois qu'ils reviennent sur le site si leur session sont expirées. En complément, on propose donc généralement de sauvegarder le login dans un cookie pour une utilisation simplifiée sur un ordinateur personnel.

 Exercices 

Vous trouverez sur cette page un exemple d'application qui constitue le sujet d'aujourd'hui.