一、cookie的概念
在一次会话从开始到结束的整个过程,全程跟踪记录客户端的状态(例如:是否登录、购物车信息、是否已下载、是否已点击、视频播放进度等)
二、cookie的组成
cookie由名/值对形式的文本组成:name=value
完整的格式为:
name=value;[expires=date];[path=path];[domain=somewhere.com];[secure],中括号是可选的,name=value是必选。
三、设置cookie
document.cookie=符合cookie格式的字符串。
(document.cookie = ‘username=tian’;
)
四、读取cookie
alert(document.cookie); 直接读取
五、编码与解码
为了避免中文编码的问题。
设置cookie的时候有这么一个原则。
编码去存储
解码去读取
encodeURIComponent 中文 => 字符
decodeURIComponent 字符 => 中文
document.cookie = ‘username=’ + encodeURIComponent(“钢铁侠”);
alert(decodeURIComponent(document.cookie));
六、cookie中的可选属性
1、expires 过期时间
如果我们不去设置过期时间,默认的过期时间是,当前会话结束时(整个浏览器关闭的时候)。
expires=日期对象
小技能:
【注】浏览器自动去清除过期的cookie。
如果我们想要删除其中某一条cookie。我们直接将这一条cookie过期日期,设置成过去的某一时刻。
document.cookie = 'username=钢铁侠;expires=' + numOfDate(7);
/*
快速获取过去的某一时刻
*/
var d = new Date(0);
alert(d); //Thu Jan 01 1970 08:00:00 GMT+0800 (中国标准时间)
window.onload = function(){
var oBtn = document.getElementById("btn1");
oBtn.onclick = function(){
document.cookie = 'username=钢铁侠;expires=' + numOfDate(-1);
}
}
//封装一个函数,获取n天后的日期
function numOfDate(n){
var d = new Date();
var day = d.getDate();
d.setDate(day + n);
return d;
}
2、path限制访问路径
path 限制访问路径
如果不设置,默认就是加载这个文件的路径。
【注】加载文件的路径,和设置cookie的路径必须一致,否则,禁止访问。
//如果我们设置一个不存在的路径,可以设置成功的
document.cookie = 'username=钢铁侠;path=' + "/cookie/demo/";
alert(document.cookie);
3.domain限制
domain 限制访问域名
如果不设置,默认的值,加载当前文件的主机名 (IP/域名)
【注】设置cookie域名的时候,必须设置cookie的域名和加载文件的域名一致,才能设置成功,否则设置失败。
document.cookie = 'username=钢铁侠;domain=' + '10.30.152.145';
4.secure安全设置
secure 安全设置,指明必须通过安全的通信通道来传输(HTTPS)才能获取cookie。
secure 设置安全链接
如果不去设置,默认的值是false,代表的是可以让任何链接访问cookie http https、
设置了secure,必须使用https协议去访问这个页面。cookie才能设置成功。
https 要比 http协议安全
https 证书认证的安全协议
document.cookie = 'username=钢铁侠;secure';
TCP协议的三次握手建立连接
TCP协议的四次挥手断开连接