为了账号安全,请及时绑定邮箱和手机立即绑定

cookie,session,sessionStorage,localStotage的区别

标签:
JavaScript

1.cookie

保存位置: 客户端

使用方式:

如果不设置过期时间,cookie保存在浏览器内存中,生命周期随浏览器的关闭而结束.简称会话cookie.
如果设置过期时间,cookie则保存在硬盘中,关闭浏览器依然存在,直到过期才消失.

2.session

保存位置: 服务器端

使用方式: session目前主流都配合cokie使用


登录案例(cookie和session结合)

用户客户端登录系统

1690b675fd6823fe
登录成功后,由图上的response的headers我们可以看到服务器端会发给客户端一个带有JSESSIONID的唯一用户标识的特殊信息,这个就是cookie,由服务器端发回并设置,此时的cookie没有设置过期时间,故生命周期是随浏览器的关闭而结束 1690b675fd7edd18?w=1018&h=243&f=png&s=31

由上图可知,每次发请求到后台时,在request的header里都会带着cookie到后台,以cookie里面的JSESSIONID在服务器中区分是哪个用户进行的操作.
因为此时存储的Cookie是会话Cookie,只要整个浏览器不关闭,cookie一直有效.
除非换浏览器打开,此时没有会话cookie,跳转到登录界面,服务器端会重新生成新的JSESSIONID返回给客户端.


3.localStorage(本地存储)

存储位置: 客户端

生命周期:

localStorage的生命周期是永久的,关闭页面或浏览器之后localStorage中的数据也不会消失。localStorage除非主动删除数据,否则数据永远不会消失。

4.sessionStorage(会话存储)

存储位置: 客户端

生命周期:

sessionStorage的生命周期是在仅在当前会话下有效。sessionStorage引入了一个“浏览器窗口”的概念,sessionStorage是在同源的窗口中始终存在的数据。只要这个浏览器窗口没有关闭,即使刷新页面或者进入同源另一个页面,数据依然存在。但是sessionStorage在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面,sessionStorage也是不一样的。

最后

  • 喜欢的记得点个star.鼓励一下,谢谢!
点击查看更多内容
2人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消