2019-08-29 JS Cookie

1. 什么是 Cookie？
   Cookie 是一些数据, 存储于你电脑上的文本文件中。
   当 web 服务器向浏览器发送 web 页面时，在连接关闭后，服务端不会记录用户的信息。
   Cookie 的作用就是用于解决 "如何记录客户端的用户信息":

当用户访问 web 页面时，他的名字可以记录在 cookie 中。
在用户下一次访问该页面时，可以在 cookie 中读取用户访问记录。
Cookie 以名/值对形式存储，如下所示:
username=John Doe
当浏览器从服务器上请求 web 页面时， 属于该页面的 cookie 会被添加到该请求中。服务端通过这种方式来获取用户的信息。

2. JS可以使用document.cookie属性来创建、读取以及删除cookie。
   创建cookie:
   document.cookie = "username=HaydnHu";
   还可以为cookie添加一个过期时间，默认情况下是浏览器关闭即删除（是这样的！和session有些类似）
   document.cookie="username=HaydnHu;expire=Thu,18 Dec 2043 12:00:00 GMT";
   可以使用path属性设定cookie的路径，默认情况下，cookie属于当前页面，只有当前页面以及子路径的页面可以访问到这个cookie。将path设置成“/”，表示将cookie放到了根目录下，整个网站都可以访问到这个cookie了。
   document.cookie="username=HaydnHu;expires=Thu,18 Dec 2043 12:00:00 GMT;path=/";
   读取cookie
   var cookie= document.cookie;
   这时将会以字符串的形式返回所有的cookie，中间用分号隔开，格式类似 cookie1=value; cookie2=value; cookie3=value;
   修改cookie
   和创建的方式基本一致，属于覆盖操作；
   删除cookie
   通过有效时间来操作，将过期时间修改成当前时间之前的一个时间就可以了。注意删除的时候可以不指定cookie的值（不是很懂为什么这样？只有一个cookie吗一个页面？不应该，还是说删除时删除所有cookie？）
   具体读取cookie的时候，可以写一个简单的函数，来从cookie字符串中读取。

3. JavaScript Cookie 实例
   首先，访问者访问 web 页面, 他将被要求填写自己的名字。该名字会存储在 cookie 中。访问者下一次访问页面时，他会看到一个欢迎的消息。在这个实例中我们会创建 3 个 JavaScript 函数：
   设置 cookie 值的函数
   获取 cookie 值的函数
   检测 cookie 值的函数
   实例
   function setCookie(cname,cvalue,exdays){
   var d = new Date();
   d.setTime(d.getTime()+(exdays2460601000));
   var expires = "expires="+d.toGMTString();
   document.cookie = cname+"="+cvalue+"; "+expires;
   }
   function getCookie(cname){
   var name = cname + "=";
   var ca = document.cookie.split(';');
   for(var i=0; i<ca.length; i++) {
   var c = ca[i].trim();
   if (c.indexOf(name)==0) { return c.substring(name.length,c.length); }
   }
   return "";
   }
   function checkCookie(){
   var user=getCookie("username");
   if (user!=""){
   alert("欢迎 " + user + " 再次访问");
   }
   else {
   user = prompt("请输入你的名字:","");
   if (user!="" && user!=null){
   setCookie("username",user,30);
   }
   }
   }