摘要:不是下面的属性,它是下面的属性,有一套专门的取值与赋值方法,与,不同特性在下面可以设置一个时间自动去清除缓存,如果不设置清除时间,则关闭浏览器自动清除。
cookie 不是window下面的属性,它是document下面的属性,cookie有一套专门的取值与赋值方法,与localStorage,sessionStorage不同特性
cookie在document下面
cookie可以设置一个时间自动去清除缓存,cookie如果不设置清除时间,则关闭浏览器自动清除。
cookie它可以跨页面,但是不可以跨path路径(子路径可以取到父级路径的) ,前提是同域
赋值新建一个文件夹,在文件夹下新建一个html页面 cookie3.html 和一个名为path2的文件夹
在path2文件夹下新建 cookie4.html
先看一下cookie:
赋值
// 普通赋值 document.cookie = "userName=Aihh" // 带过期时间 10s后清除cookie var d = new Date(); d.setTime(Date.now() + 10*1000); document.cookie = "userName=Aihh;Expires=" + d.toUTCString(); // 带访问路径 document.cookie="age=18;path=/path2";
注意:
设置过期时间使用的是0时区的时间,而我们北京时间是+8区的时间,所以这个时候要调用 toUTCString() 转换为标准时区的时间;
path=/path2 设置只有在路径path2下面的网页才能访问(前提是同域),如果是 path=/ 则说明是根路径,任何同域页面都可以访问。
赋值后打开 Application 查看 cookie
普通赋值
带过期时间,设置10s后过期
带路径,设置只有在路径path2下面的网页才能访问(前提是同域)
这个时候发现在 cookie3.html 找不到这个cookie
再打开path2下面的 cookie4.html ,就会看到这个cookie
封装cookie 属性和值是用 = 连接,属性之间用 ; 分隔,根据这个特点进行封装
var CookieHelper = { addCookie: function (cookieName, cookieValue, exMinutes, cookiePath) { // 第三/四个参数,按需传参 var str = cookieName + "=" + cookieValue; if (arguments.length == 3) { let d = new Date(); d.setTime(Date.now() + exMinutes*60*1000); // 过期单位这里设置为分钟 str += ";Expires=" + d.toUTCString(); } if (arguments.length == 4) { str += ";path=" + cookiePath; } document.cookie = str; }, getCookie: function (cookieName) { var cookieArr = document.cookie.split(";"); for (let i in cookieArr) { var arr = cookieArr[i].split("="); if (arr[0].trim() == cookieName) { return arr[1]; } } }, removeCookie: function (cookieName) { document.cookie = cookieName + "= ;Expires=" + (new Date()).toUTCString(); } }与 localStorage,sessionStorage 的区别
localStorage,sessionStorage在window下面, cookie在document下面
localStorage要手动清除,sessionStorage关闭浏览器自动清除,而cookie可以设置一个时间自动去清除,cookie如果不设置清除时间,则关闭浏览器自动清除。
localStorage可以跨同域页面,sessionStorage只能跨父子页面(通过 open() 打开的页面),cookie它可以跨页面,但是不可以跨path路径(子路径可以取到父级路径的) 。他们都不能跨域
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/104019.html
摘要:不是很安全,别人可以分析存放在本地的并进行欺骗,考虑到安全应当使用。因此不是一种持久化的本地存储,仅仅是会话级别的存储。用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。 前言 总括:详细讲述Cookie,LocalStorge,SesstionStorge的区别和用法。 人生如画,岁月如歌。 原文博客地址:Javascript本地存储小结 知乎专栏&&简书专题:前端...
摘要:的属性在浏览器的控制台中,可以直接输入来查看。可以在浏览器的控制台中看出哪些是类型的,下带绿色对勾的即是,如图只要是类型的在控制台通过是获取不到的,也不能进行修改。当会话过期或被放弃后,服务器将终止该会话。在中,用取代了。 本文由云+社区发表 在前端面试中,有一个必问的问题:请你谈谈cookie和localStorage有什么区别啊? localStorage是H5中的一种浏览器本地存...
摘要:握手过程中使用了的标志和。接收端收到后,回传一个带有标志的数据包以示传达确认信息。第四次挥手主动关闭方收到后,发送一个给被动关闭方,确认序号为收到序号,至此,完成四次挥手。其次,通过使和系统绑定来降低泄露后的危险。 一些开放性题目 1.自我介绍:除了基本个人信息以外,面试官更想听的是你与众不同的地方和你的优势。 2.项目介绍 3.如何看待前端开发? 4.平时是如何学习前端开发的? 5....
阅读 3475·2021-10-13 09:39
阅读 1458·2021-10-08 10:05
阅读 2260·2021-09-26 09:56
阅读 2275·2021-09-03 10:28
阅读 2673·2019-08-29 18:37
阅读 2032·2019-08-29 17:07
阅读 600·2019-08-29 16:23
阅读 2191·2019-08-29 11:24