cookie基础知识
cookie可以使javascript可以在用户的硬盘上持久的存储数据,并且可以获取这种方式存储的数据.可以用Document.cookie属性来脚本化cookie,帮助实现客户端脚本化.
cookie是一个字符串属性,可以用它对当前网页的cookie进行读,创建,修改,删除等操作.每个cookie都有四个可选属性,分别控制生存期,可见性,安全性.第一个属性:expire或者max-age,设定数据的最终保存时间,超过这个事件,cookie会删除掉保存的数据.第二个属性:path,它指定了与cookie关联在一起的网页.默认情况情况下,只有和设置cookie的网页来自同一个web服务器的页面才可以访问cookie.第三个属性:secure,默认false,如果设置为true,只有浏览器和服务器通过安全协议连接时才被传输.
expire,max-age,path,domain,secure都是cookie的属性.
在检查cookie是否开启方法:navigator.cookieEnabled属性为true,表示开启;false表示关闭.这是一个非标准的方法,但大多数浏览器是可以这样.
cookie的存储
数据在cookie中存储是以name=value的形式.如果数据要设置保存时间,要这样设置name=value;max-age=seconds. cookie的全限定样式是: name=value;max-age=seconds;path=path;domian=domian;secure
cookie的局限
主要用于少量数据存储.浏览器不允许超过300个cookie,每个web服务器不要超过20个,每个cookie保存的数据不能超过4KB.
cookie的读取
cookie数据单元之间是以";"分割的,读取数据的方法主要使用String.indexOf()和String.substring(),有可能还会用到String.split().如果cookie值编码时使用了函数encodeURIComponent(),那么解码数据的时候就要使用decodeURIComponent().
cookie读取示例:
var allcookie=document.cookie;
var pos=allcookie.indexof("version=");
if(pos!=-1){
var start=pos+8;
var end=allcookie.indexof(";",start);
if(end==-1)end=allcookie.length;
var value=allcookie.substring(start,end);
value=decodeURIComponent(value);//get value in cookie
if(value!=document.lastModified)console.log("This document has changed since you were last here!");//on Firefox console,get the tool tip
}
下面是cookie的封装代码,实现了类
function Cookie(name){
this.$name=name;
var allcookie=document.cookie;
if(allcookie=="")return;
var cookies=allcookie.split(";");
var cookie=null;
if(var i=0;i<cookies.length;i++){
if(cookies[i].substring(0,name.length+1)==(name+"=")){
cookie=cookies[i];
break;
}
}
if(cookie==null)return;
var cookieval=cookie.substirng(name.length+1);
var a=cookieval.split('&');
for(var i=0;i<a.length;i++){
a[i]=a[i].split(':');
}
for(var i=0;i<a.length;i++){
this[a[i][0]]=decodeURIComponent(a[i][1]);
}
}
Cookie.prototype.store=function(daysToLive,path,domain,secure){
var cookieval="";
for(var prop in this){
if((prop.charAt(0)=="$")||((typeof this[prop])=="function"))continue;
if(cookieval!="")cookieval+='&';
cookieval+=prop+':'+encodeURIComponent(this[prop]);
}
var cookie=this.$name+'='+cookieval;
if(daysToLive||daysToLive==0){
cookie+=";max-age="+(daysToLive*24*60*60);
}
if(path)cookie+=";path="+path;
if(domain)cookie+=";domain="+domain;
if(secure)cookie+=";secure";
document.cookie=cookie;
}
Cookie.prototype.remove=function(path;domian,secure){
for(var prop in this){
if((prop.charAt(0)=="$")||((typeof this[prop])=="function"))delete this[prop];
}
this.store(0,path,domain,secure);
}
Cookie.enabled=function(){
if(navigator.cookieEnabled!=undefined)return navigator.cookieEnabled;
if(Cookie.enabled.cache!=undefined)return Cookie.enabled.cache;
document.cookie="testcookie=test;max-age=10000";
var cookies=document.cookie;
if(cookies.indexof("testcookie=test")!=-1){ return Cookie.enabled.cache=false;}
else{ document.cookie="testcookie=test;max-age=0"; return Cookie.enabled.cache=true; }
}
封装类的使用
var cookie=new Cookie("visitordata");
if(!cookie.name||!cookie.color){
cookie.name=prompt("what is your name:","");
coolie.color=prompt("What is your favorite color:","");
}
if(!cookie.visits)cookie.visits=1;
else cookie.visits++;
cookie.store(10);
document.write('<h1 style="color:'+cookie.color+'">'+
'Welcome,'+cookie.name+'!'+'</h1>'+
'<p>You have visited '+cookie.visits+' times.'+
'<button οnclick="window.cookie.remove();">Forget Me</button>');
cookie的替代方案
IE的userData插件和Adobe Flash的插件.(略过)