sessionStorage、cookie、localStorage生命周期区别


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

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值