cookie储存
Cookie
用于储存Web页面用户信息
什么是 Cookie?
Cookie 是一些数据, 存储于你电脑上的文本文件中。
当 web 服务器向浏览器发送 web 页面时,在连接关闭后,服务端不会记录用户的信息。
Cookie 的作用就是用于解决 "如何记录客户端的用户信息":
-
当用户访问 web 页面时,他的名字可以记录在 cookie 中。
-
在用户下一次访问该页面时,可以在 cookie 中读取用户访问记录。
Cookie 以名/值对形式存储,如下所示:
username=John Doe
当浏览器从服务器上请求 web 页面时, 属于该页面的 cookie 会被添加到该请求中。服务端通过这种方式来获取用户的信息。
javascript中使用document.cookie属性来创建 、读取、及删除 cookie。
获取
document.cookie;
删除
document.cookie = "a=; expires=Thu, 01 Jan 1970 00:00:01 GMT";
设置
// 关闭页面失效 document.cookie = "a=1; b=2"; // 一周后失效 var d = new Date(); d.setTime(d.getTime() + 7 * 24 * 60 * 60 * 1000); document.cookie = "c=3; expires=" + d.toUTCString(); // 当前页面有效 document.cookie = "a=1; path=/";
封装成函数,便于调用
/** * [setCookie 添加单个cookie] * @param {String} key [cookie名] * @param {String} value [cookie值] * @param {String} expires [有效时间] * @param {String} path [cookie路径] */ function setCookie(key = '', value = '', expires = '', path='') { if(expires) { var d = new Date(); var t = 24 * 60 * 60 * 1000; if(~expires.indexOf('m')) t = 60 * 1000; // 分 if(~expires.indexOf('h')) t = 60 * 60 * 1000; // 时 if(~expires.indexOf('d')) t = 24 * 60 * 60 * 1000; // 天 if(~expires.indexOf('D')) t = 7 * 24 * 60 * 60 * 1000; // 周 if(~expires.indexOf('M')) t = 30 * 24 * 60 * 60 * 1000; // 月 if(~expires.indexOf('Y')) t = 365 * 24 * 60 * 60 * 1000;// 年 d.setTime(d.getTime() + (parseInt(expires) * t)); var expires = "; expires=" + d.toUTCString(); } if(path) path = '; path='+path; document.cookie = key + '='+value+expires+path; } /** * [getCookie 获取cookie] * @param {[type]} key [cookie名] * @return {[type]} [cookie值] */ function getCookie(key) { var coo = document.cookie; var cooArr = coo.split(';'); for(var i = 0; i < cooArr.length; i++) { var c = cooArr[i].trim().split('='); if(c[0] == key) { return c[1]; } } } /** * [removeCookie 删除cookie] * @param {[type]} key [cookie名] * @return {[type]} [无] */ function removeCookie(key) { document.cookie = key+'=; expires=Thu, 01 Jan 1970 00:00:00 GMT'; } /** * [setCookies 设置cookie,可多个,不可以设置有效日期和cookie路径] * @param {[Object]} obj [要储存的cookie的键值对] */ function setCookies(obj) { if (!~arr.constructor.toString().indexOf('Object')) throw ('参数只能是数组!'); for(var i in obj) { setCookie(i, obj[i]); } } /** * [removeCookies 删除cookie,可多个,数组参数] * @param {[Array]} arr [要删除的cookie名数组] * @return {[type]} [无] */ function removeCookies(arr) { if(!~arr.constructor.toString().indexOf('Array')) throw('参数只能是数组!'); for (var i in arr) { removeCookie(arr[i]); } }