本地存储生命周期
window.sessionStorage
cookie 主要用于存储访问过的网站数据,存储浏览器的信息到本地计算机中,用于客户端和服务器端的通讯
localStorage
应包含 进一步认识 生命周期,作用域 api 存储容量 用途 优点缺点
,本篇写主要通过实验来介绍生命周期方面的
localStorage>cookie
未设置cookie过期时间,只要关闭浏览器窗口,cookie就消失了
设置过期时间 cookie 浏览器就会把cookie保存到硬盘上,关闭后再次打开浏览器,这些cookie依然有效直到超过设定的过期时间
、
localStorage的生命周期是永久的,关闭页面或浏览器之后localStorage中的数据也不会消失。localStorage除非主动删除数据,否则数据永远不会消失。
cookie
document.cookie方式创建的cookie,就是在给浏览器添加cookie 也可在发起请求时,在请求头中的Cookie传给服务器
当浏览器发送请求且浏览器存在 Cookie 时,浏览器会自动在请求头携带上 Cookie 数据。引入 Cookie 的意义是因为 HTTP 的请求是无状态的,如:浏览器发出的请求服务器没办法区分浏览器用户身份以及用户的相关操作状态(可以通过 Cookie 传递这些信息,验证了用户身份之后,才允许访问服务器数据)
localStorage['test1']=111
//设置cookie documentt.cookie="key=value"
document.cookie="test2=222"
//获取cookie值 一开始获取到键值对字符传
document.cookie '_a=9636340546693; Token=ABCDEFGABCDEFGABCDEFGABCDEFGABCDEFGYzk5IDJ8MTowfDEwOjE2NzU3MzkzMjJ; JO_ID=BB64A2BENVHA3ZGWKND3AKI35ISE4KJ3GEKKJLG2JR4GPYODRMABCDEFG; 3AB9=BB64A2BENVHA3ZGWKND3AKIIM5ZSDTPYODRMDEFGABCDEFGABCDEFGABCDEFG; test2=222'
cookie_list
(5) ['_ati=9636340546693', 'Token==ABCDEFGABCDEFGABCDEFGABCDEFGABCDEFGYzk5IDJ8MTowfDEwOjE2NzU3MzkzMjJ', 'JO_ID=BB64A2BENVHA3ZGWKND3AKI35ISE4KJ3GEKKJLG2JR4GPYODRMABCDEFG', '3AB9=BB64A2BENVHA3ZGWKND3AKIIM5ZSDTPYODRMDEFGABCDEFGABCDEFGABCDEFG', 'test2=222']
cookie 和localstorage区别
qa:cookie过期时间是默认的,关闭浏览器,是否cookie就被清除了, localStorage呢?
an 控制台看 localStorage[‘test1’] 输出为 ‘111’ localStorage中的test1还在
cookie 中之前设置的 test2 已经消失了
document.cookie
'_ati=9636340546693; 3AB9=BB64A2BENVHA3ZGWKND3AKIIM5ZSDTPYODRMDEFGABCDEFGABCDEFGABCDEFG'
document.cookie.split(";")
(2) ['_ati=9636340546693', ' 3AB9=BB64A2BENVHA3ZGWKND3AKIIM5ZSDTPYODRMDEFGABCDEFGABCDEFGABCDEFG']
session和cookie区别
cookie和session都用来存储用户信息,cookie存放于客户端有可能被窃取,所以cookie一般用来存放不敏感的信息,比如用户设置的网站主题,敏感的信息用session存储,比如用户的登录信息
webStorage 浏览器本地存储
HTML5中提出了webStorage的概念,webStorage包括sessionStorage和localStorage,只为了保存数据,不会与服务器进行通信
localStorage与sessionStorage之间有明显区别:
sessionStorage会在浏览器窗口被关闭时自动清除,而localStorage并不会。
sessionStorage
qa 关闭浏览器时,sessionStorage设置的键 还存在吗
sessionStorage['test3']=555
an 重新打开浏览器时,sessionStorage设置的键不存在了
sessionStorage['test3']
undefined
总结
从生命周期和用途区分 localstorage sessionStorage cookie
从生命周期来看,localstorage 被存储到硬盘上,关闭浏览器不会清除 , cookie 不设置过期时间,关闭浏览器,cookie存储的数据会被清除,cookie会被请求头传给服务器,
sessionStorage和localstorage同属于浏览器本地存储,但关闭浏览器时,sessionStorage存储的数据 会被清除
参考 https://blog.csdn.net/Dax1_/article/details