>  기사  >  웹 프론트엔드  >  브라우저 저장 기술 쿠키 및 세션의 예

브라우저 저장 기술 쿠키 및 세션의 예

零下一度
零下一度원래의
2017-06-28 09:28:241549검색

HTTP 상태 비저장 프로토콜은 프로토콜에 트랜잭션 처리를 위한 메모리 기능이 없음을 의미합니다.
세션 추적
프로토콜의 상태는 전송 정보를 "기억"하는 다음 전송의 능력을 나타냅니다. 브라우저가 서버에 요청을 보내면 서버가 응답하지만, 동일한 브라우저가 다시 서버에 요청을 보내면 응답을 하게 되지만, 지금은 자신이 동일한 브라우저인지는 알 수 없습니다. 상대적으로 독립적입니다.

쿠키의 가장 일반적인 적용은 등록된 사용자가 웹사이트에 로그인했는지 여부를 확인하는 것입니다. 사용자는 다음 번에 이 웹사이트에 접속할 때 사용자 정보를 유지할 것인지 묻는 메시지를 표시하여

로그인 절차를 단순화할 수 있습니다. 쿠키의. 또 다른 중요한 응용 분야는 "장바구니" 처리입니다. 사용자는 일정 기간 내에 동일한 웹사이트의 다른 페이지에서 다른 제품을 선택할 수 있습니다. 이 정보는 최종 결제 시 정보가 추출될 수 있도록 쿠키에 기록됩니다.


Javascript는 쿠키를 사용합니다
이런 상황이 있다고 가정해 보겠습니다. A 페이지에서 B 페이지로 이동합니다. A 페이지에서 JS를 사용하여 temp 변수를 사용하여 특정 변수의 값을 저장하는 경우, B,

temp의 변수 값을 참조하려면 JS를 사용해야 합니다. JS에서 전역 변수나 정적 변수의 수명 주기는 페이지 점프가 발생하거나 페이지가 닫히면

이 변수의 값입니다. 다시 로드됩니다. 즉, 저장 효과가 달성되지 않습니다. 이 문제에 대한 가장 좋은 해결책은 쿠키를 사용하여 변수의 값을 저장하는 것입니다. 그렇다면 쿠키를 설정하고 읽는 방법은 무엇입니까?
먼저 쿠키의 구조에 대해 조금 이해해야 합니다. 간단히 말하면 쿠키는 키-값 쌍의 형태, 즉 키=값 형식으로 저장됩니다. 각 쿠키는 일반적으로 ";"으로 구분됩니다.


H5에서 webStorage는 실제로 웹에 데이터를 저장하는데 이는 두 가지 유형으로 나뉩니다.
sessionStorage 저장된 데이터는 브라우저를 닫으면 사라집니다. --- 임시 저장소

localStorage 항상 존재합니다 --- 영구 저장소


Set
세션 저장소:
sessionStorage.setItem("smessage",dataDom.value);

Get
sessionStorage.getItem("smessage")

removeItem 삭제 키

사용: 삭제 지정 키 로컬 저장소의 값
사용법: .removeItem(key)

코드 예:

sessionStorage.removeItem("key"); localStorage.removeItem("site")


clear 모든 키/값 지우기 ​​
Usage : 모든 키/값 지우기
사용법: .clear()
코드 예:
sessionStorage.clear();

1. 쿠키는 일반적으로 4095kb보다 크지 않습니다.
2. 클라이언트와 서버 모두 데이터에 액세스할 수 있습니다
3. 제한된 기간

로컬 저장: 로컬 브라우저만 액세스할 수 있으며, 각 도메인 크기는 5M입니다.
만료 시간이 없습니다.

쿠키가 핵심입니다. -value pair key=value 형식으로 저장됩니다. 각 쿠키는 일반적으로 ";"로 구분됩니다.
document.cookie="name="+username;

var username=document.cookie.split(";")[0].split("=")[1];



//JS 쿠키 운영 방식!
//쿠키 쓰기

function setCookie(이름,값)

{
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000 );
document.cookie = 이름 + "="+ 이스케이프(값) + ";expires=" + exp.toGMTString();
}

//쿠키 가져오기
function getCookie(이름)
{

var arr, reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");

if(arr=document.cookie.match(reg))
return unescape(arr[ 2]);
else
return null;
}
//쿠키 삭제
function delCookie(name)
{
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(이름);
if(cval!=null)
document.cookie= 이름 + "="+cval+";expires="+exp.toGMTString();
}
//사용 예
setCookie(" name","hayden");
alert(getCookie("name"));
//맞춤 만료 시간을 설정해야 하는 경우
//그런 다음 위의 setCookie 함수를 다음 두 함수로 바꿉니다.
/ /Program code
function setCookie(name,value,time)
{
var strsec = getsec(time);
var exp = new Date();
exp.setTime(exp.getTime() + strsec*1);
문서. 쿠키 = 이름 + "="+ 이스케이프(값) + ";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;
}
else if (str2== "h ")
{
return str1*60*60*1000;
}
else if (str2=="d")
{
return str1*24*60*60*1000;
}
}
// 이것은 만료 시간 설정의 예:
//s20은 20초를 나타냅니다.
//h는 시간을 나타냅니다(예: 12시간): h12
//d는 일 수, 30일: d30
setCookie(" name" ,"헤이든","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;
  }
  //username
  // 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('다시 오신 것을 환영합니다 '+username+'!');
//setCookie("username",username,-1);
}else{
  username=prompt('이름을 입력하세요:',"")
  if (username!=null && username!=""){
setCookie('username',username,365)
}
  }
}
onload=checkCookie();

위 내용은 브라우저 저장 기술 쿠키 및 세션의 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.