强盗与士兵,恶魔的声音广播剧,小町桃子
什么是localstorage
对浏览器来说,使用 web storage 存储键值对比存储 cookie 方式更直观,而且容量更大,它包含两种:localstorage 和 sessionstorage
1.sessionstorage(临时存储) :为每一个数据源维持一个存储区域,在浏览器打开期间存在,包括页面重新加载
2.localstorage(长期存储) :与 sessionstorage 一样,但是浏览器关闭后,数据依然会一直存在
所以上次使用cookie的时候就遇到了一个坑,设置后马上访问session会获取不到,蛋疼,还需要刷新一下,原因是:
当我们首次访问设置cookie的页面时,服务器会把设置的cookie值通过响应头发送过来,告诉浏览器将cookie存储的本地相应文件夹中(注意:第一次访问时本地还没有存储cookie,所以此时获取不到值);
当第二次访问(或在进行cookie设置后,过期前所有的访问)时,请求头信息你中都会把cookie值携带。(百度到的,暂时还没理解透彻,先搬过来).
vue中实现本地储存的方法:localstorage,在html5中,新加入了一个localstorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),localstorage中一般浏览器支持的是5m大小,这个在不同的浏览器中localstorage会有所不同。
(1).储存数据
localstorage.setitem('accesstoken', 'bearer ' + response.data.result.accesstoken)
(2).取出数据
localstorage.getitem('accesstoken')
(3).删除储存数据
localstorage.removeitem('accesstoken')
(4).更改数据
localstorage.setitem('accesstoken', '更改后' + response.data.result.accesstoken)
使用时有两点需要注意过的地方:
. localstorage在浏览器的隐私模式下面是不可读取的。
. localstorage本质上是对字符串的读取,有json格式时需要json.stringify()转化为字符串。
. localstorage不能被爬虫抓取到
注意点
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。
如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复
VUE+elementui组件在table-cell单元格中绘制微型echarts图
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
vue 路由懒加载中给 Webpack Chunks 命名的方法
网友评论