Comment définir des cookies en javascript

En JavaScript, vous pouvez utiliser l'attribut cookie de l'objet document pour définir, lire ou supprimer des cookies, la syntaxe est "document.cookie="cookieName=Value;expires=expires time";".

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

1. Qu'est-ce qu'un cookie

Le HTTP utilisé pour charger les pages Web dans le navigateur est un protocole "sans état", également ça. c'est-à-dire que lorsque le serveur envoie la page au navigateur, il considère que la chose est terminée et n'enregistre aucune information. Cela rend difficile le maintien d'une certaine sorte de continuité pendant une session de navigateur, comme l'enregistrement du contenu auquel un utilisateur a accédé ou téléchargé, ou l'enregistrement du statut de connexion de l'utilisateur dans une zone privée.

Le cookie est un moyen de résoudre ce problème. Par exemple, un cookie peut enregistrer la dernière visite de l'utilisateur, enregistrer une liste des préférences de l'utilisateur ou enregistrer les articles dans le panier pendant que l'utilisateur continue ses achats. Lorsqu'ils sont utilisés correctement, les cookies peuvent améliorer l'expérience utilisateur du site.

Le cookie lui-même est une courte chaîne d'informations qui peut être enregistrée sur l'ordinateur de l'utilisateur par la page et peut ensuite être lue par d'autres pages. Les cookies expirent généralement après une certaine période de temps.

Limitations des cookies

Les navigateurs ont des limites quant au nombre de cookies pouvant être enregistrés, généralement quelques centaines ou plus. Généralement, 20 cookies par domaine sont autorisés et chaque domaine peut stocker jusqu'à 4 Ko de cookies.

En plus des problèmes qui peuvent être causés par les restrictions de taille, il existe de nombreuses raisons qui peuvent provoquer la disparition des cookies sur le disque dur, comme l'atteinte de la date d'expiration ou la suppression du cookie par l'utilisateur. informations, ou en passant à un autre navigateur. Par conséquent, les cookies ne doivent jamais être utilisés pour enregistrer des données importantes, et lors de l'écriture du code, la situation dans laquelle le cookie attendu ne peut pas être obtenu doit être prise en compte

2, document.cookie Attributs

JavaScript utilise l'attribut cookie de l'objet document pour créer, lire et supprimer des cookies.

Chaque cookie est essentiellement une chaîne composée d'une paire de nom et de valeur, comme ceci :

username=sam

Lorsque la page est chargée dans le navigateur, le navigateur collectera tout cookies liés à la page et placez-les dans l'attribut document.cookie semblable à une chaîne. Dans cet attribut, chaque cookie est séparé par un point-virgule :

username=sam;location=China;

#J'appelle document.cookie un attribut "de type chaîne", car ce n'est pas une vraie chaîne, il s'agit simplement d'une extraction Lorsque les informations du cookie sont utilisées , cet attribut se comporte comme une chaîne

Encodage et décodage des données

Certains caractères ne peuvent pas être utilisés dans les cookies, notamment les symboles de points, les virgules et les espaces. caractères (tels que les espaces et les tabulations). Avant de stocker des données dans un cookie, les données doivent être codées afin qu'elles puissent être stockées correctement.

Avant de stocker des informations, utilisez la fonction escape() de JavaScript pour encoder, et lors de l'obtention des données du cookie d'origine, utilisez la fonction unescape() correspondante pour décoder.

La fonction excape() convertit tous les caractères non-ASCII de la chaîne au format hexadécimal à 2 ou 4 chiffres correspondant, par exemple les espaces sont convertis en %20 et sont convertis en % 26.

Par exemple, le code suivant affichera la chaîne d'origine enregistrée dans la variable str et le résultat après l'encodage escape() :

   
  
hello owrld
  
  

Vous pouvez voir L'espace est représenté par %20, le crochet gauche est %28 et le crochet droit est %29.

3. Composition du cookie

Les informations contenues dans document.cookie semblent être constituées de paires de noms et de chaînes de valeurs, la La forme de chaque paire de données est :

name=value

Mais en fait, chaque cookie contient également d'autres informations connexes, qui sont présentées séparément ci-dessous.

cookieName et cookieValue

cookieName et cookieValue sont le nom et la valeur dans name=value vu dans la chaîne de cookie.

domaine

L'attribut domain indique au navigateur à quel domaine appartient le cookie. Cet attribut est facultatif. Lorsqu'il n'est pas spécifié, la valeur par défaut est le domaine de la page sur laquelle le cookie est défini.

La fonction de cet attribut est de contrôler le fonctionnement des cookies par sous-domaines. En termes de distance, s'il est défini sur www.example.com, alors la page du sous-domaine code.example.com ne peut pas lire ce cookie. Mais si l'attribut de domaine est défini sur example.com, alors la page dans code.example.com peut accéder à ce cookie.

path

L'attribut path spécifie le répertoire dans lequel les cookies peuvent être utilisés. Si vous souhaitez que seules les pages du répertoire documents définissent la valeur du cookie, définissez le chemin sur /documents. Cet attribut est facultatif et le chemin par défaut couramment utilisé est /, indiquant que le cookie peut être utilisé dans tout le domaine.

secure

secure属性是可选的，而且几乎很少使用。它表示浏览器在把整个cookie发送给服务器时，是否应该使用SLL安全标准。

expires

每个cookie都有一个失效日期，过期就自动删除了。expires属性要以UTC时间表示。如果没有设置这个属性，cookie的生命期就和当前浏览器会话一样长，会在浏览器关闭时自动删除。

4，编写cookie

要编写新的cookie，只要把包含所需属性的值赋予document.cookie就可以了:

document.cookie = "username=sam;expires=15/05/2018 00:00:00"

使用javascript的Date对象可以避免手工输入日期和时间格式；

var cookieDate = new Date(2018,05,15); document.cookie = "username=sam;expires="+cookieDate.toUTCString();

这样就能达到和前面一样的结果。

#注意这里使用了cookieDate.toUTCString()函数，而不是cookieDate.toString();这是因为cookie的时间要以UTC格式设置。

在实际编码时，应该用excape()函数来确保在给cookie赋值时不会有非法字符:

var cookieDate = new Date(2018,05,15); var user = "Sam Jones"; document.cookie = "username="+excape(user)+";expires="+cookieDate.toUTCString();

5，编写cookie的函数

很自然就会想到编写一个函数专门用于生成cookie，完成编码和可选属性的组合操作。下面的程序清单就列出了一个这样的程序代码:

function createCookie(name,value,days,path,domain,secure){ if(days){ var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = date.toGMTString(); } else var expires = ""; cookieString = name + "=" +excape(value); if(expires) cookieString += ";expires=" +expires; if(path) cookieString += ";path=" + escape(path); if(domain) cookieString += ";domain=" + escape(domain); if(secure) cookieString += ";secure=" + escape(secure); document.cookie = sookieString; }

这个函数的执行的操作是相当直观的，name和value参数组合得到"name = value",其中的value还经过编码以避免非法字符。

在处理有效期时，使用的参数不是具体日期，而是cookie有效的天数。函数根据这个天数生成有效的日期字符串。

其他属性都是可选的，如果设置了，就会附加到组成cookie的字符串里。

【推荐学习：javascript高级教程】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!