JavaScript-Cookie操作

介绍

Cookies是一种技术，bai它能够把你在访问网站时产生的一些行为信息给读取保存下来。

最常见的便是我们在访答问某些网页的的时候提示我们是否要保存用户名和密码，我们点击确定后，再次来到网站的时候，网站就能够读取到cookies，知道我们的用户信息，做出相应的处理机制，我们则不用再输入用户名和密码。

为了节省时间 我们直接将 所有Cookie常用的代码封装好了 直接使用就行了

基本上游览器 每个域名或ip cookie限制为30~ 50个 注意: 建议不要超过20个 否则会出现 未知情况

cookie总大小限制为:4095个字节 包括名（name）、值（value） 也就是相当于 4095个 英文字母

如果是汉字的话 大约 1000个汉字左右 所以需要你格外的注意 别什么都往Cookie里写

js-cookie.js

//1.  设置Cookie	

//JS操作cookies方法!
//写cookies    name(键)  value(值)  
//time设置cooke 的过期时间
// s(秒)  h(小时)  d(天)  0(永不过期)  比如 h1就是1小时后过期
function setCookie(name, value, time) {
	var strsec;
	if (time == 0) {
		strsec = "Fri, 31 Dec 9999 23:59:59 GMT";
		document.cookie = name + "=" + escape(value) + ";expires=" + strsec + ";path=/;";
		return;
	}
	var strsec = getsec(time);
	var exp = new Date();
	exp.setTime(exp.getTime() + strsec * 1);
	document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString() + ";path=/";
}
//获取时间
function getsec(str) {
	var str1 = str.substring(1, str.length) * 1;
	var str2 = str.substring(0, 1);
	if (str2 == "s") {
		return str1 * 1000;
	} else if (str2 == "h") {
		return str1 * 60 * 60 * 1000;
	} else if (str2 == "d") {
		return str1 * 24 * 60 * 60 * 1000;
	}

}



//2. 查询Cookie 	

function getCookie(name) {
	var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
	if (arr = document.cookie.match(reg)) {
		return unescape(arr[2]);
	} else {
		// 如果 不存在返回null
		return null;
	}

}


//3. 删除Cookie
// 原理就是将Cookie 的过期时间 改为-1  就是 立马过期
//删除cookies
function delCookie(name) {
	var exp = new Date();
	exp.setTime(exp.getTime() - 1);
	var cval = getCookie(name);
	if (cval != null) {
		document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString() + ";path=/;";
	}

}

//4.删除 当前作用域下 所有Cookie
function delCookieAll() {
  var keys = document.cookie.match(/[^ =;]+(?==)/g)
  if (keys) {
    for (var i = keys.length; i--;) {
      document.cookie = keys[i] + '=0;path=/;expires=' + new Date(0).toUTCString() // 清除当前域名下的,例如：m.ratingdog.cn
      document.cookie = keys[i] + '=0;path=/;domain=' + document.domain + ';expires=' + new Date(0).toUTCString() // 清除当前域名下的，例如 .m.ratingdog.cn
      document.cookie = keys[i] + '=0;path=/;domain=ratingdog.cn;expires=' + new Date(0).toUTCString() // 清除一级域名下的或指定的，例如 .ratingdog.cn
    }
  }
}

注意事项 :别动 path 直接使用 /的方式 因为在js中无法获取指定Path下的Cookie 只能获取 / 路径的Cookie

Cookie使用方法

在用的时候导入 js-cookie.js文件

<script src="./js-cookie.js"></script>

添加Cookie

			// 创建cookie    key=test1  value=xxxx1   30秒后过期   
				setCookie("test1","xxxx1","s30");


			// 创建 cookie   key=test2  value=xxxx2    一小时后过期   
			setCookie("test2","xxxx1","h1");


			// 创建 cookie   key=test3  value=xxx3    一天后过期    
			setCookie("test3","xxx3","d1");


			// 	创建 cookie   key=test  value=xxxx4    永不过期    
			setCookie("test4","xxxx4",0);

我们可以在火狐游览器 按下F12 查看

作用域= 你的ip 或者 域名

作用范围 = 也就是当前作用域下的那个目录 可以访问

到期时间= Cookie 被自动删除时间

Cookie 大小 不能超过 游览器默认的 Cookie总 大小 否则添加失败

获取Cookie

			 //查询key 为test1 的cookie 的值   
			var cookie_test= getCookie("test2") 
			console.log(cookie_test)

删除Cookie

			// 删除Cookie  
			 delCookie("test4")

删除当前域下的所有Cookie

			delCookieAll()
			console.log(document.cookie) //查询看看还有Cookie没