cookie！cookie！cookie！

大家好，初来乍到请多关照，因为自己对cookie的理解稍弱，所以借此博客来增加一些印象；

首先，了解一下COOKIE的诞生，为什么叫会话跟踪技术？

在一次会话从开始到结束的整个过程，全程跟踪记录客户端的状态（例如：是否登录、购物车信息、是否已下载、是否 已点赞、视频播放进度等等）

把COOKIE就当成是第一次跟服务器连接后，服务器发给你的身份牌，上面就记录跟你有关的信息 以后只要再跟服务器通信，必须带着这个身份牌 这样一来，关于你是谁？ 有没有登陆过？ 购物车里有什么信息？ 服务器当然就很容易知道了。

下面简单说一下cookie的组成和属性：

一、cookie的组成
cookie 由名/值对形式的文本组成：name=value。完整格式为：
name=value;[expires=date];[path=path];[domain= somewhere.com];[secure]，
中括号是可选，name=value 是必选。
1、设置cookie
document.cookie = 符合cookie格式的字符串。

2、读取cookie
alert(document.cookie); 直接读取

3、编码与解码
为了保证在存储cookie和读取cookie的过程中，防止中文乱码，一般情况下，将中文编码存储，读取的时候再解码读取。
document.cookie=‘user=‘ +encodeURIComponent(‘小白’); //编码写入
alert(decodeURIComponent(document.cookie)); //解码读取
二、cookie中可选属性详解
1、失效时间 — expires
expires=date
失效时间，如果没有声明，则为浏览器关闭后即失效。声明了失效时间， 那么时间到期后方能失效。
var date=newDate(); //创建一个
date.setDate(date.getDate() +7);
document.cookie=“user= “+ encodeURIComponent(‘田雨飞’)+";expires=" +date;

PS：可以通过 Firefox 浏览器查看和验证失效时间。如果要提前删除 cookie 也非常简单， 只要重新创建 cookie 把时间设置当前时间之前即可：date.getDate() -1 或 newDate(0)。

2、path限制访问路径
path=path 限制访问路径，当设置了路径，那么只有设置的那个路径文件才可以访问 cookie。

var path=’/E:/%E5%A4%87%E8%AF%BE%E7%AC%94%E8%AE%B0/JS1/29/demo’;
document.cookie=“user= “+ encodeURIComponent(‘田雨飞’)+ “;path=”+path;

PS：为了操作方便，我直接把路径复制下来，并且增加了一个目录以强调效果。

3、domain限制
domain=domain 访问域名，用于限制只有设置的域名才可以访问，那么没有设置，会 默认限制为创建 cookie 的域名。
var domain =‘baidu.com’;
document.cookie="user= "+ encodeURIComponent(‘田雨飞’)+ “;domain=”+domain;
PS：如果定义了 baidu.com ，那么在这个域名下的任何网页都可访问.必须访问域名和设置cookie的域名一致，否则cookie设置失败。

4、secure安全设置
secure 安全设置，指明必须通过安全的通信通道来传输(HTTPS)才能获取 cookie。
document.cookie="user= "+ encodeURIComponent(‘田雨飞’)+ “;secure”;
PS：https 安全通信链接需要单独配置。

三、封装cookie
function setCookie(name, value, obj){
//将name和value编码去存储
var cookieStr = encodeURIComponent(name) + “=” + encodeURIComponent(value);
if(obj){
if(obj.expires){
cookieStr += “;expires=” + numOfDate(obj.expires);
}
if(obj.path){
cookieStr += “;path=” + obj.path;
}
if(obj.domain){
cookieStr += “;domain=” + obj.domain;
}
if(obj.secure){
cookieStr += “;secure”;
}
}
//将cookie设置成功
document.cookie = cookieStr;
}
function getCookie(name){
var cookieStr = decodeURIComponent(document.cookie);
var start = cookieStr.indexOf(name);
if(start == -1){
return null;
}else{
//找从start开始，遇到的第一个分号
var end = cookieStr.indexOf(";", start);
if(end == -1){
end = cookieStr.length;
}
}
var subStr = cookieStr.substring(start, end);
var arr = subStr.split("=");
return arr[1];
}
function removeCookie(name){
document.cookie = encodeURIComponent(name) + “=;expires=” + new Date(0);
}
四、建议练习：简易的用户名登录注册