JavaScript et cookies
Que sont les Cookies ?
Les navigateurs Web et les serveurs utilisent le protocole HTTP pour communiquer et HTTP est un protocole sans état. Mais pour un site Web commercial, il est nécessaire de conserver les informations de session entre les différentes pages. Par exemple, l’enregistrement d’un utilisateur se termine après avoir terminé plusieurs pages. Mais comment conserver les informations de session des utilisateurs sur toutes les pages Web.
Dans de nombreuses situations, l’utilisation de cookies est la méthode la plus efficace pour mémoriser et suivre les préférences, les achats, les commissions et d’autres informations nécessaires à une meilleure expérience des visiteurs ou aux statistiques du site.
Comment ça fonctionne ?
Votre serveur envoie certaines données au navigateur du visiteur sous la forme d’un cookie. Le navigateur peut accepter le cookie. Si c’est le cas, il est stocké sous forme d’enregistrement en texte brut sur le disque dur du visiteur. Désormais, lorsque le visiteur arrive sur une autre page de votre site, le navigateur envoie le même cookie au serveur pour qu’il le récupère. Une fois récupéré, votre serveur sait/se souvient de ce qui a été stocké précédemment.
Les cookies sont un enregistrement de données en texte brut de 5 champs de longueur variable −
-
Expire − La date d’expiration du cookie. S’il est vide, le cookie expirera lorsque le visiteur quittera le navigateur.
-
Domaine − Le nom de domaine de votre site.
-
Chemin − Le chemin d’accès au répertoire ou à la page Web qui a défini le cookie. Ce champ peut être vide si vous souhaitez récupérer le cookie à partir de n’importe quel répertoire ou page.
-
Sécurisé − Si ce champ contient le mot “sécurisé”, alors le cookie ne peut être récupéré qu’avec un serveur sécurisé. Si ce champ est vide, aucune restriction de ce type n’existe.
-
Nom=Valeur − Les cookies sont définis et récupérés sous la forme de paires clé-valeur
Les cookies ont été initialement conçus pour la programmation CGI. Les données contenues dans un cookie sont automatiquement transmises entre le navigateur Web et le serveur Web, de sorte que les scripts CGI sur le serveur peuvent lire et écrire les valeurs des cookies qui sont stockées sur le client.
JavaScript peut également manipuler les cookies en utilisant le biscuit propriété de la Document objet. JavaScript peut lire, créer, modifier et supprimer les cookies qui s’appliquent à la page Web en cours.
Stockage des cookies
Le moyen le plus simple de créer un cookie consiste à attribuer une valeur de chaîne à l’objet document.cookie, qui ressemble à ceci.
document.cookie = "key1 = value1;key2 = value2;expires = date";
Ici le expire L’attribut est facultatif. Si vous fournissez à cet attribut une date ou une heure valide, le cookie expirera à une date ou une heure donnée et par la suite, la valeur des cookies ne sera pas accessible.
Note − Les valeurs de cookie ne peuvent pas inclure de points-virgules, de virgules ou d’espaces. Pour cette raison, vous pouvez utiliser le JavaScript s’échapper() fonction pour encoder la valeur avant de la stocker dans le cookie. Si vous procédez ainsi, vous devrez également utiliser les unescape() fonction lorsque vous lisez la valeur du cookie.
Exemple
Essayez ce qui suit. Il définit un nom de client dans un cookie d’entrée.
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
if( document.myform.customer.value == "" ) {
alert("Enter some value!");
return;
}
cookievalue = escape(document.myform.customer.value) + ";";
document.cookie = "name=" + cookievalue;
document.write ("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie();"/>
</form>
</body>
</html>
Sortir
Maintenant, votre machine a un cookie appelé nom. Vous pouvez définir plusieurs cookies en utilisant plusieurs paires clé = valeur séparées par une virgule.
Cookies de lecture
Lire un cookie est aussi simple que d’en écrire un, car la valeur de l’objet document.cookie est le cookie. Vous pouvez donc utiliser cette chaîne chaque fois que vous souhaitez accéder au cookie. La chaîne document.cookie conservera une liste de paires nom=valeur séparées par des points-virgules, où nom est le nom d’un cookie et value est sa valeur de chaîne.
Vous pouvez utiliser des chaînes’ diviser() fonction pour diviser une chaîne en clé et valeurs comme suit –
Exemple
Essayez l’exemple suivant pour obtenir tous les cookies.
<html>
<head>
<script type = "text/javascript">
<!--
function ReadCookie() {
var allcookies = document.cookie;
document.write ("All Cookies : " + allcookies );
// Get all the cookies pairs in an array
cookiearray = allcookies.split(';');
// Now take key value pair out of this array
for(var i=0; i<cookiearray.length; i++) {
name = cookiearray[i].split('=')[0];
value = cookiearray[i].split('=')[1];
document.write ("Key is : " + name + " and Value is : " + value);
}
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
<p> click the following button and see the result:</p>
<input type = "button" value = "Get Cookie" onclick = "ReadCookie()"/>
</form>
</body>
</html>
Note − Ici longueur est une méthode de Déployer classe qui renvoie la longueur d’un tableau. Nous aborderons les tableaux dans un chapitre séparé. À ce moment-là, veuillez essayer de le digérer.
Note − Il se peut que d’autres cookies soient déjà installés sur votre machine. Le code ci-dessus affichera tous les cookies installés sur votre machine.
Définition de la date d’expiration des cookies
Vous pouvez prolonger la durée de vie d’un cookie au-delà de la session de navigation en cours en définissant une date d’expiration et en enregistrant la date d’expiration dans le cookie. Cela peut être fait en réglant le ‘expire’ attribuer à une date et une heure.
Exemple
Essayez l’exemple suivant. Il illustre comment prolonger la date d’expiration d’un cookie de 1 mois.
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
var now = new Date();
now.setMonth( now.getMonth() + 1 );
cookievalue = escape(document.myform.customer.value) + ";"
document.cookie = "name=" + cookievalue;
document.cookie = "expires=" + now.toUTCString() + ";"
document.write ("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
</form>
</body>
</html>
Sortir
Suppression d’un cookie
Parfois, vous souhaiterez supprimer un cookie afin que les tentatives ultérieures de lecture du cookie ne renvoient rien. Pour ce faire, il vous suffit de définir la date d’expiration sur une heure passée.
Exemple
Essayez l’exemple suivant. Il illustre comment supprimer un cookie en fixant sa date d’expiration à un mois de retard par rapport à la date actuelle.
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
var now = new Date();
now.setMonth( now.getMonth() - 1 );
cookievalue = escape(document.myform.customer.value) + ";"
document.cookie = "name=" + cookievalue;
document.cookie = "expires=" + now.toUTCString() + ";"
document.write("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
</form>
</body>
</html>
Sortir
#JavaScript #cookies
