关于前端localStorage的使用

结合上一章token的,这次来说一下localStorage的使用。

LocalStorage是HTML5加入的新特性,他可以在前端存储一些数据,且不会过期,在一定程度上可以把它理解为一个前端数据库,在这里存储token是在合适不过了。

LocalStorage的操作非常简单,他的写入有三种方法:

window.localStorage.a = 'study';
window.localStorage['b'] = 'eat';
window.localStorage.setItem('c', 'play');

他们的效果是一样的,他们的值可以在浏览器的控制台查看

 读取也有三种方法,与写入基本一致:

let a = window.localStorage.a = 'study';
let b = window.localStorage['b'] = 'eat';
let c = window.localStorage.getItem('c', 'play');

删除有两种方式,分为全部删除和删除某个字段

window.localStorage.clear();
// 清除所有localStorage

window.localStorage.removeItem('a');
// 清除单条数据

基本操作就这些,每次启动页面时吧之前存的token发往服务器进行校验,通过后返回用户信息,如此便可以实现用户自动登录的功能。

最后,这里有一个小坑,所有存在localStorage的值都会被转化为字符串,所以,若要在localStorage里存对象的话,在取出来的时候需要对它进行转化。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值