Maison > interface Web > js tutoriel > le corps du texte

Exemples de cookies et de sessions de technologies de stockage du navigateur

零下一度
Libérer: 2017-06-28 09:28:24
original
1560 Les gens l'ont consulté

Le protocole HTTP sans état signifie que le protocole n'a aucune capacité de mémoire pour le traitement des transactions.
Suivi de session
L'état du protocole fait référence à la capacité de la prochaine transmission à "se souvenir" des informations de transmission. L'état sans état fait référence à deux
consécutifs de la même session (notez ce qu'est la même session). Les requêtes ne se comprennent pas. Lorsque le navigateur envoie une requête au serveur, le serveur répond, mais lorsque le même navigateur envoie à nouveau une requête au serveur
, il répondra, mais il ne sait pas que vous l'êtes. le navigateur à l'instant. Chaque fois qu'une requête et une réponse sont relativement indépendantes.

L'application la plus typique des cookies est de déterminer si un utilisateur enregistré s'est connecté au site Web. L'utilisateur peut être invité à conserver les informations de l'utilisateur la prochaine fois qu'il entrera sur ce site Web pour simplifier la
connexion. procédure. Ce sont les fonctions des cookies. Une autre application importante est le traitement du « panier ». Les utilisateurs peuvent choisir différents produits sur différentes pages
du même site Web au cours d'une période donnée, et ces informations seront écrites dans des cookies afin que les informations puissent être extraites lors du paiement final.

Javascript utilise des cookies
Supposons qu'une telle situation existe. Dans un certain processus de cas d'utilisation, passez de la page A à la page B. Si JS est utilisé dans la page A pour enregistrer la valeur d'une certaine variable en utilisant la valeur variable temp, lorsque sur la page B,
doit également utiliser JS pour référencer la valeur variable de temp. Le cycle de vie des variables globales ou des variables statiques dans JS est limité lorsqu'un saut de page se produit ou que la page est fermée. ,
Les valeurs de ces variables seront rechargées, c'est-à-dire que l'effet d'économie ne sera pas obtenu. La meilleure solution à ce problème est d'utiliser des cookies pour enregistrer la valeur de la variable. Alors, comment définir et lire les
cookies ?
Tout d'abord, vous devez comprendre un peu la structure des cookies. En termes simples : les cookies sont enregistrés sous la forme de paires clé-valeur, c'est-à-dire au format clé=valeur. Chaque cookie est généralement séparé par ";"


Dans H5, webStorage stocke en fait des données sur le web, qui sont divisées en deux types :
sessionStorage Les données stockées à la fermeture du navigateur disparaîtront --- Stockage temporaire
localStorage peut toujours exister --- Stockage permanent

Paramètres
stockage de session :
sessionStorage.setItem("smessage",dataDom.value);

Get
sessionStorage.getItem("smessage")

removeItem delete key
Objectif : Supprimer la valeur du stockage local de la clé spécifiée
Utilisation : .removeItem(key)
Exemple de code :
sessionStorage.removeItem("key"); localStorage.removeItem("site");


clear effacer toutes les clés/valeurs
Objectif : effacer toutes les clés/ value
Utilisation : .clear()
Exemple de code :
sessionStorage.clear(); localStorage.clear();

1 Les cookies ne dépassent généralement pas 4095 ko ; de nombreux paramètres seront lents ;
2. Le client et le serveur peuvent accéder aux données
3. Limite de temps limitée

Stockage local : seul le navigateur local peut y accéder, la taille de chaque domaine est de 5 M
Non. délai d'expiration ; Dépôt et récupération ;


Les cookies sont enregistrés sous forme de paires clé-valeur, c'est-à-dire au format clé=valeur. Chaque cookie est généralement séparé par ";".
document.cookie="name="+username;
var username=document.cookie.split(";")[0].split("=")[1];


//Méthode de cookie d'opération JS !
//Écrire des cookies
function setCookie(name,value)
{
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp. toGMTString();
}

//Obtenir un cookie
fonction getCookie(name)
{
var arr,reg=new RegExp("(^| )"+name+" =([^;]*)(;|$)");
if(arr=document.cookie.match(reg))
return unescape(arr[2]);
else
return null;
}
//Supprimer le cookie
function delCookie(name)
{
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString() ;
}
//Exemple d'utilisation
setCookie("name","hayden");
alert(getCookie("name"));
//Si vous devez définir la personnalisation Heure d'expiration
//Ensuite, remplacez la fonction setCookie ci-dessus par les deux fonctions suivantes et tout ira bien ;
//Code du programme
fonction setCookie(nom, valeur, heure)
{
var strsec = getsec(time);
var exp = new Date();
exp.setTime(exp.getTime() + strsec*1);
document.cookie = name + "="+ escape ( value) + ";expires=" + exp.toGMTString();
}
function getsec(str)
{
alert(str);
var str1=str.substring (1 ,str.length)*1;
var str2=str.substring(0,1);
if (str2=="s")
{
return str1*1000;
>
sinon si (str2=="h")
{
return str1*60*60*1000;
>
sinon si (str2=="d")
{
return str1*24*60*60*1000;
}
}
//Voici un exemple de réglage du délai d'expiration :
//s20 représente 20 secondes
//h fait référence à l'heure, par exemple 12 heures : h12
//d est le nombre de jours, 30 jours : d30
setCookie("name","hayden","s20");


封装函数
//获取
function getCookie(c_name){
if (document.cookie.length>0) {
  var c_start=document.cookie.indexOf(c_name + "=")
  //console.log(c_start);
  if(c_start!=-1){
  c_start=c_start + c_name.length+1
  }else{
return;
  }
  //nom d'utilisateur
  // console.log(c_start);
c_end=document.cookie.indexOf(";",c_start)
console.log(c_end) ;
if (c_end==-1) {
c_end=document.cookie.length;
}    
return document.cookie.substring(c_start,c_end);
  }else{
  return ""
  }

}
//设置
function setCookie(c_name,value,expiredays){
var exdate=new Date()
exdate. setDate(exdate.getDate()+expiredays);
document.cookie=c_name+ "=" +value+";"+((expiredays==null) ? "" : ";expires="+exdate.toGMTString() )
}
//检查
function checkCookie(){
var username=getCookie('username')
console.log(username);
if (username!=null && username!=""){
alert('Bienvenue à nouveau '+username+'!');
//setCookie("username",username,-1);
}else{
username=prompt('Veuillez entrer votre nom :',"")
  if (username!=null && username!=""){
setCookie('username',username,365)
}
  }
}
onload=checkCookie();

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal