关于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中包含特殊的值

 

posted @ 2016-07-21 18:00  李二leon  阅读(169)  评论(0编辑  收藏  举报