关于cookie
一.准备:
存储于访问者计算机中的变量,每当统一体计算机通过浏览器请求某个页面,就通过js创建和取回cookie
本质是字符串信息,存放在客户端的计算机中,用于客户端计算机与服务器之间传递信息。
js通过document.cookie来读取或者设置这些信息
多用在客户端和服务端进行通信
除了js,服务器端语言也可以存取cookie
二.基础
1. 大小有限制,
2. 最终都是以文件形式存放在客户端当中,都可以随便查看和修改cookie
3. 每个cookie的格式都是 key = value
4. cookie的形式是string
5. cookie的域和路径的概念
5.1 域:domain,不同的域之间是不能跨域访问cookie的
5.2 路径:routing,一个网页所创建的 cookie 只能被与这个网页在同一目录或子目录下得所有网页访问,而不能被其他目录下得网页访问
6. 创建cookie的方式和定义变量的方式相似,都需要使用 cookie 名称和 cookie 值。同个网站可以创建多个 cookie ,而多个 cookie 可以存放在同一个cookie 文件中.
三.FAQ
1.两种类型:1)你浏览的当前网站本身的cookie
2)来自网页上嵌入的广告和其他域名来源的cookie
2.两种时效状态
1)临时性质的cookie,使用过程中存储,浏览器关闭删除
2)设置失效的时间,浏览器关闭依然留存在计算机中
3.两种清除的方式
1)浏览器清除 2)失效时间
注意:有时候删除cookie之后会导致某些网页无法运行
4.浏览器可以设置拒绝接收和访问cookie
5.使用建议:尽量降低cookie的使用数量,并且要尽量小的使用cookie
四. 用法
document.cookie = 'username=leon'
如果username存在就修改不存在就是创建
1. 读取操作
function getCookie(c_name){
if (document.cookie.length>0){ //先查询cookie是否为空,为空就return ""
c_start=document.cookie.indexOf(c_name + "=") //通过String对象的indexOf()来检查这个cookie是否存在,不存在就为 -1
if (c_start!=-1){
c_start=c_start + c_name.length+1 //最后这个+1其实就是表示"="号啦,这样就获取到了cookie值的开始位置
c_end=document.cookie.indexOf(";",c_start) //这句是为了得到值的结束位置。因为需要考虑是否是最后一项,所以通过";"号是否存在来判断
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end)) //通过substring()得到了值。想了解unescape()得先知道escape()是做什么的,都是很重要的基础,想了解的可以搜索下,在文章结尾处也会进行讲解cookie编码细节
}
}
return ""
}
中间涉及了编码的操作
2. 设置有效期
var _date = new Date();
_date.setDate(_date.getDate()+30);
_date.toGMTString();
完整设置 cookie
function setCookie(c_name, value, expiredays){ // 名 值 过期时间
var exdate=new Date();
exdate.setDate(exdate.getDate() + expiredays);
document.cookie=c_name+ "=" + escape(value) + ((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
}
// 使用方法:setCookie('username','Darren',30)
若要改成按照小时来设置 cookie的话用
exdate.setHours(exdate.getHours() + expiredays);
五. cookie高级
1. 路径的概念
一般是只有子域名下面可以访问cookie
可以设置cookie能被其他的目录或者父级的目录访问,通过设置cookie 可以实现
document.cookie =
"name=value;path=path"document.cookie =
"name=value;expires=date;path=path"
path就是路径
常见是设置为path是根目录,这样大家都可以访问
document.cookie = "name=value;path=/"
2. 域的概念
路径可以解决了在同一个域下访问cookie,同域名直接的访问
document.cookie = "name=value;path=path;domain=domain"
用法示例
如:www.qq.com 和 sports.qq.com公用宇哥关联的域名 "qq.com",想要"sports.qq.com"下的cookie被"www.qq.com"访问,就需要设置domain属性
,同时path要设置为"/"
写法:
document.cookie = "username=Leon;path=/;domain=qq.com"
需要注意的是一定是同域名直接的访问,不能把domain的值设置成非主域名之外的域名
3.关于安全性
通常cookie是使用HTTP连接传递数据,容易被查看,如果cookie的信息比较重要那么要使用加密的数据传输
属性名:secure ,默认的值为空。当有这个属性的时候,cookie与服务器之间就通过HTTPS或者其他安全的协议传递数据。
document.cookie = "username=Leon;secure"
这个过程只会保证cookie与服务器之间的数据传输过程加密,而保存在本地的cookie文件并不会加密。本地得自己加密数据。
ps:secure属性也不能代表他人看不到你的机器本地保存的cookie信息
4.关于cookie的值的设定。
cookie的值不能包含空格,分号,逗号。
一般情况下,cookie的信息的存储都是采用未编码的方式。所以设置cookie的时候,要先使用escape( )将cookie值进行编码。
在获取到cookie的时候再使用uscape( )函数将值转换回来
使用示例
setcookie
document.cookie = name + "=" + escape( value );
getcookie
return unescape( document.cookie.substring( c_start, c_end ));