JavaScript对cookie的粗浅操作

不念不忘少年蓝@ 2022-07-16 14:00 203阅读 0赞

## Cookie ##

接到任务要验证某软件对cookie的支持，却突然发现自己并不知道怎么对cookie操作……

特地把学习过程记录下来，梳理一下，并且方便以后回顾。

### 什么是cookie? ###

cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。 -w3school

通俗点说，cookie就是浏览器存储在访问者系统中的一些小文件，用来保存访问者的一些信息，比如访问者的用户名，密码，或者上次退出的位置等等。

### Cookie怎么用 ###

###### 首先来看下Cookie怎么写 ######

在JavaScript中，对cookie的存储需要通过Document对象的cookie属性，具体的存储如下：

document.cookie = "username = Darren"

以上代码中’username’表示 cookie 名称，’Darren’表示这个名称对应的值。假设 cookie 名称并不存在，那么就是创建一个新的 cookie；如果存在就是修改了这个 cookie 名称对应的值。如果要多次创建 cookie ，重复使用这个方法即可。

###### 然后看下cookie怎么读 ######

cookie的读取其实也不是很难，也就是对于字符串的操作，下面是从w3school找到的一种：

function getCookie(c_name) { 
    if (document.cookie.length>0)//首先查询cookie是否是空的
      {
      c_start=document.cookie.indexOf(c_name + "=")//检测这个cookie是否存在
      if (c_start!=-1)//如果cookie存在
        { 
        c_start=c_start + c_name.length+1 //获取到cookie的值的开始位置
        c_end=document.cookie.indexOf(";",c_start)//从c_start开始查找";"的存在
        if (c_end==-1) c_end=document.cookie.length//如果没找到，说明是最后一项
        return unescape(document.cookie.substring(c_start,c_end))//把cookie的值拆分出来并且对这个值进行解码，unescape()与escape()相对，对被escape()编码的字符串进行解码
        } 
      }
    return ""//不存在就返回空
    }

###### cookie中的有效期 ######

在默认情况下，cookie的会随着浏览器的关闭而清除掉，但是我们可以通过expires(意为：到期)来设置cookie的有效期。只需要在创建或修改cookie时加上一条命令就行了：

document.cookie = "name = value; expires = date"

date时GMT(格林威治时间)形式的日期型字符串。

**注:**有个大坑需要注意，chrome时不支持本地的页面中js的cookie操作的。（被这个坑惨了，以为自己写错了，找了好久好久好久。。。）

参考资料：[某大神的博客][Link 1]

[Link 1]: http://www.cnblogs.com/Darren_code/archive/2011/11/24/Cookie.html