在项目里面用到了cookie来记录登录的状态,以前存储是放在localstroage里面的,所以有点懵逼,回家看了一下cookie的使用,就总结下,以免下次需要使用:
1:cookie的基础概念
1.1 cookie有生命周期的,他是会过期的!!
过期时间是可以手动设置的,如果不设置过期时间,那么默认就是浏览器关闭,则cookie消失
过期时间是针对每一个键值对设置的!
1.2. cookie是以域名为单位进行存储的,各个域名之间不能共享cookie
1.3. cookie的存储容量是有限制的,每个域名下最多存储4KB内容
1.4. cookie是分路径存储的,一个域名下的cookie可以分路径进行存储
子路径中存储cookie,不能再父路径中访问
父路径中存储的cookie,是可以在子路径中访问的,所以,一般情况下,如果想要在整个域名中共享cookie内容,都会将其存储在根路径中!!
http://baidu.com/s/a/b http://baidu.com/s/a/ http://baidu.com/s/ http://baidu.com/
1.5. cookie中的信息,会伴随着每一次的请求,发送给服务器,不论什么请求
注意: 一般情况下,不会往cookie中存储大量的数据
1.6. cookie不仅可以在浏览器端操作,也可以在服务器端操作
在服务器端操作,其实就是在响应头中添加了一个set-cookie的内容,浏览器接收到这个响应信息之后,会将对应的内容存入cookie中!!
2:cookie的使用:
//1. 获取cookie内容
//document.cookie
// console.log(document.cookie);
//2. 给cookie中添加内容
//注意:这个赋值是追加操作,不会将之前有的内容给覆盖掉
//name=daiweifang
// document.cookie = "name=daiweifang";
// document.cookie = "banzhang=tanhaiyin";
//3. 过期时间
//默认的过期时间是浏览器关闭
//设置过期时间??
//GMT:格林威治时间
//UTC:世界协调时间
//过期时间,可以通过在给cookie赋值的时候,后面加上expires=gmt格式的时间
document.cookie = "name=daiweifang;expires=" + new Date("2222-02-22 22:22:22").toGMTString()
//4. 设置路径
// document.cookie = "name=daiweifang;path=/"
//5. 大小限制演示
// document.cookie="a=1231231231231231231231231231231231231231"
//6. 删除cookie
//可以通过设置过期时间来实现!!!
3:常用的获取cookie的函数:
function getCookieObj() {
var cookie = {};
for (var i = 0; i < kvPairArr.length; i++) {
//kvPair "key=value"
// var kvPair = kvPairArr[i];
// var key = kvPair.split("=")[0].trim();
// var value = kvPair.split("=")[1];
cookie[kvPairArr[i].split("=")[0].trim()] = kvPairArr[i].split("=")[1];
}
return cookie;
}
function getCookieByKey(key) {
var cookie = {};
for (var i = 0; i < kvPairArr.length; i++) {
//kvPair "key=value"
// var kvPair = kvPairArr[i];
// var key = kvPair.split("=")[0].trim();
// var value = kvPair.split("=")[1];
cookie[kvPairArr[i].split("=")[0].trim()] = kvPairArr[i].split("=")[1];
}
return cookie[key];
}
网友评论