session Storage

WebStorage的目的是克服由cookie所带来的一些限制,当数据需要被严格控制在客户端时,不需要持续的将数据发回服务器。

WebStorage两个主要目标:(1)提供一种在cookie之外存储会话数据的路径。(2)提供一种存储大量可以跨会话存在的数据的机制。

1, 生命周期:

session Storage(会话存储) :
sessionStorage的生命周期是在仅在当前会话下有效。sessionStorage引入了一个“浏览器窗口”的概念,sessionStorage是在同源的窗口中始终存在的数据。只要这个浏览器窗口没有关闭,即使刷新页面或者进入同源另一个页面,数据依然存在。但是sessionStorage在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面,sessionStorage也是不一样的。
localStorage(本地存储):
localStorage的生命周期是永久的,关闭页面或浏览器之后localStorage中的数据也不会消失。localStorage除非主动删除数据,否则数据永远不会消失。

2、存储大小:

localStorage和sessionStorage的存储数据大小一般都是:5MB

3、存储位置:

localStorage和sessionStorage都保存在客户端,不与服务器进行交互通信。

4、存储内容类型:

localStorage和sessionStorage只能存储字符串类型,对于复杂的对象可以使用ECMAScript提供的JSON对象的stringify和parse来处理

5、获取方式:

localStorage:window.localStorage;;sessionStorage:window.sessionStorage;。

6、应用场景:

localStoragese:常用于长期登录(+判断用户是否已登录),适合长期保存在本地的数据。sessionStorage:敏感账号一次性登录;

警告

用的vivo手机,vivo自带世界之窗浏览器,每次跳转一个新的页面都是重新打开了一个webpage,导致sessionStorage设置的值都没啦!!!所以开发移动端网页的话,慎用sessionStorage属性。。。

使用规范:
sessionStorage.方法------>>>
  setItem (key, value) ——  保存数据,以键值对的方式储存信息。
  getItem (key) ——  获取数据,将键值传入,即可获取到对应的value值。
  removeItem (key) ——  删除单个数据,根据键值移除对应的信息。
  clear () ——  删除所有的数据
  key (index) —— 获取某个索引的key

cookie 、sessionStorage与localStorage的区别
在这里插入图片描述

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值