关于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

四. 用法

1. document.cookie = 'username=leon'

如果username存在就修改不存在就是创建

1. 读取操作

1. function getCookie(c_name){
2. 　　　　if (document.cookie.length>0){　　//先查询cookie是否为空，为空就return ""
3. 　　　　　　c_start=document.cookie.indexOf(c_name + "=")　　//通过String对象的indexOf()来检查这个cookie是否存在，不存在就为 -1　　
4. 　　　　　　if (c_start!=-1){
5. 　　　　　　　　c_start=c_start + c_name.length+1　　//最后这个+1其实就是表示"="号啦，这样就获取到了cookie值的开始位置
6. 　　　　　　　　c_end=document.cookie.indexOf(";",c_start)　　//这句是为了得到值的结束位置。因为需要考虑是否是最后一项，所以通过";"号是否存在来判断
7. 　　　　　　　　if (c_end==-1) c_end=document.cookie.length　　
8. 　　　　　　　　return unescape(document.cookie.substring(c_start,c_end))　　//通过substring()得到了值。想了解unescape()得先知道escape()是做什么的，都是很重要的基础，想了解的可以搜索下，在文章结尾处也会进行讲解cookie编码细节
9. 　　　　　　}
10. 　　　　}
11. 　　　　return ""
12. }

中间涉及了编码的操作

2. 设置有效期

1. var _date = new Date();
2. _date.setDate(_date.getDate()+30);
3. _date.toGMTString();

完整设置 cookie

1. function setCookie(c_name, value, expiredays){    // 名  值  过期时间
2. 　　　　var exdate=new Date();
3. 　　　　exdate.setDate(exdate.getDate() + expiredays);
4. 　　　　document.cookie=c_name+ "=" + escape(value) + ((expiredays==null) ? "" : ";expires="+exdate.toGMTString());
5. 　　}
6. // 使用方法：setCookie('username','Darren',30)

若要改成按照小时来设置 cookie的话用

1. exdate.setHours(exdate.getHours() + expiredays);

五. cookie高级

1. 路径的概念

一般是只有子域名下面可以访问cookie

可以设置cookie能被其他的目录或者父级的目录访问，通过设置cookie 可以实现

1. document.cookie = "name=value;path=path"
2. document.cookie = "name=value;expires=date;path=path"

path就是路径

常见是设置为path是根目录，这样大家都可以访问

1. document.cookie = "name=value;path=/"

2. 域的概念

路径可以解决了在同一个域下访问cookie，同域名直接的访问

1. 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要设置为"/"

写法：

1. document.cookie = "username=Leon;path=/;domain=qq.com"

需要注意的是一定是同域名直接的访问，不能把domain的值设置成非主域名之外的域名

3.关于安全性

通常cookie是使用HTTP连接传递数据，容易被查看，如果cookie的信息比较重要那么要使用加密的数据传输

属性名：secure ，默认的值为空。当有这个属性的时候，cookie与服务器之间就通过HTTPS或者其他安全的协议传递数据。

1. document.cookie = "username=Leon;secure"

这个过程只会保证cookie与服务器之间的数据传输过程加密，而保存在本地的cookie文件并不会加密。本地得自己加密数据。

ps：secure属性也不能代表他人看不到你的机器本地保存的cookie信息

4.关于cookie的值的设定。

cookie的值不能包含空格，分号，逗号。

一般情况下，cookie的信息的存储都是采用未编码的方式。所以设置cookie的时候，要先使用escape( )将cookie值进行编码。

在获取到cookie的时候再使用uscape( )函数将值转换回来

使用示例

setcookie

1. document.cookie = name + "=" + escape( value );

getcookie

1. return unescape( document.cookie.substring( c_start, c_end ));

这样不需要考虑cookie中包含特殊的值