JavaScript-Cookie操作
2021/10/7 9:10:55
本文主要是介绍JavaScript-Cookie操作,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
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没
这篇关于JavaScript-Cookie操作的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2025-01-11有哪些好用的家政团队管理工具?
- 2025-01-11营销人必看的GTM五个指标
- 2025-01-11办公软件在直播电商前期筹划中的应用与推荐
- 2025-01-11提升组织效率:上级管理者如何优化跨部门任务分配
- 2025-01-11酒店精细化运营背后的协同工具支持
- 2025-01-11跨境电商选品全攻略:工具使用、市场数据与选品策略
- 2025-01-11数据驱动酒店管理:在线工具的核心价值解析
- 2025-01-11cursor试用出现:Too many free trial accounts used on this machine 的解决方法
- 2025-01-11百万架构师第十四课:源码分析:Spring 源码分析:深入分析IOC那些鲜为人知的细节|JavaGuide
- 2025-01-11不得不了解的高效AI办公工具API