cookie

cookie的创建形式

document.cookie = “key=value expires=失效时间 path=路径访问 domain=域名访问 secure”  
红色的代码为可选部分

 

例子1（基本创建）

document.cookie = "user=tom"; //user为键，tom为值

 

例子2（添加失效时间）

var d = new Date();
d.setTime( d.getTime() + (1*24*60*60*1000) ); //天数 * 24小时 * 60分钟 * 60秒 * 1000毫秒
var expires = "expires=" + d.toGMTString();
document.cookie = "user=lcf; " + expires;

1天后，这个cookie会失效

 

例子3（设置path）

现在我们创建3个文件，分别是 ：

a.html、b.html、c.html

a.html代码

var d = new Date();
d.setTime( d.getTime() + (1*24*60*60*1000) ); 
var expires = "expires=" + d.toGMTString();
document.cookie = "a=b; " + expires;

b.html代码为空 （一个空的html文件即可）

c.html代码

var d = new Date();
d.setTime( d.getTime() + (1*24*60*60*1000) ); 
var expires = "expires=" + d.toGMTString();
document.cookie = "c=d; " + expires;

然后把他们上传到服务器上，目录关系如下 ：

注意，c.html用一个文件夹存储

然后分别运行这3个文件，打开google的控制台的cookie选项，查看结果。

a.html

b.html

c.html

可以看到，b.html可以访问到a.html的cookie
c.html也可以访问到a.html的cookie
但是a.html和b.html不能访问c.html的cookie
如果想要a.html和b.html都可以访问到c.html的cookie，则需要在c.html的cookie里设置path。
如下 ：

var d = new Date();
d.setTime( d.getTime() + (1*24*60*60*1000) ); 
var expires = "expires=" + d.toGMTString();
document.cookie = "c=d; " + expires + '; path=/';

再次运行打开google的控制台查看结果 ：

a.html

b.html

c.html

可以看到，c.html的cookie的path发生了改变

注意 ：c.html的cookie除了test文件夹下的页面都可以访问外，test的上级目录也可以访问到

若只想test目录下的文件，才有资格访问c.html的cookie，则需要这样设置 ：

var d = new Date();
d.setTime( d.getTime() + (1*24*60*60*1000) ); 
 var expires = "expires=" + d.toGMTString();
document.cookie = "c=d; " + expires + '; path=/test'; //path为test文件夹的目录

 

domain的作用

略

 

secure的作用

通常 cookie 信息都是使用HTTP连接传递数据，这种传递方式很容易被查看，所以 cookie 存储的信息容易被窃取。假如 cookie 中所传递的内容比较重要，那么就要求使用加密的数据传输。
所以 cookie 的这个属性的名称是“secure”，默认的值为空。如果一个 cookie 的属性为secure，那么它与服务器之间就通过HTTPS或者其它安全协议传递数据。语法如下：
document.cookie = "username=Darren;secure"
把cookie设置为secure，只保证 cookie 与服务器之间的数据传输过程加密，而保存在本地的 cookie文件并不加密。如果想让本地cookie也加密，得自己加密数据。
注：就算设置了secure 属性也并不代表他人不能看到你机器本地保存的 cookie 信息，所以说到底，别把重要信息放cookie就对了

 

封装cookie的设置与获取函数

//获取cookie
function getCookie(name) {
  if (document.cookie.length > 0) {
    let c_start = document.cookie.indexOf(name + '=');
    if (c_start != -1) {
      c_start = c_start + name.length + 1;
      let 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));
    }
  }
  return '';
};

//设置cookie
function setCookie(cname, cvalue, exdays) {
  var d = new Date();
  d.setTime(d.getTime() + exdays * 24 * 60 * 60 * 1000);
  var expires = 'expires=' + d.toGMTString();
  document.cookie = cname + '=' + cvalue + '; ' + expires;
};

//删除cookie
function delCookie (name) {
  setCookie(name, '', -1);
};