localstorage知识与封装过期时间

学习过程中找到的知识,怕自己忘记,在此记一下。

参考网址:localstorage 必知必会 | 菜鸟教程

修改之后:

/**
 * 取token
 */
function getToken(exp){//exp是设置的过期时间
    var val = localStorage.getItem('token');//获取存储的元素
    if(val == null || val == '' || val == undefined){
        layer.confirm('登录信息异常,请重新登录!', {
            btn: ['确定'] //按钮
        }, function(){
            toLogin();
        });
    }
    var dataobj = JSON.parse(val);//解析出json对象
    if(new Date().getTime() - dataobj.time > exp) {//如果当前时间-减去存储的元素在创建时候设置的时间 > 过期时间
        //提示过期
        localStorage.removeItem("token");//清除值
        layer.confirm('登录超时,请重新登录!', {
            btn: ['确定'] //按钮
        }, function(){
            toLogin();
        });
    }
    return dataobj.val;
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
封装localstorage,使其支持设置过期时间可以通过以下步骤实现: 1. 创建一个自定义的封装函数,例如setLocalStorageWithExpire(key, value, expire),该函数接受三个参数:key表示存储的键名,value表示存储的值,expire表示过期时间。 2. 在该函数内部,首先计算存储数据的过期时间,可以使用Date对象的getTime()方法获取当前时间时间戳,然后根据过期时间计算出具体的过期时间戳。 3. 接下来使用localStorage.setItem()方法将键值对存储到本地存储中,可以使用JSON对象的方法将value转换为字符串再进行存储。 4. 在存储键值对的同时,还需要将过期时间存储起来,可以使用localStorage.setItem()方法将过期时间戳存储到另一个键名中,例如expire_key,作为过期时间的标志。 5. 在需要获取存储数据时,创建一个新的函数getLocalStorageWithExpire(key),该函数接受一个参数key表示需要获取的键名。 6. 在该函数内部,首先使用localStorage.getItem()方法获取键值对的值,然后使用JSON对象的parse()方法将字符串转换为对象格式,得到存储的值。 7. 紧接着,使用localStorage.getItem()方法获取过期时间时间戳,然后与当前时间戳进行比较,若过期时间大于当前时间,则说明数据还未过期,返回存储的值。 8. 如果过期时间小于等于当前时间,则说明数据已过期,可以使用localStorage.removeItem()方法将键值对和过期时间从本地存储中移除。 通过以上步骤,我们可以对localStorage进行封装,使其支持设置过期时间,方便在存储数据时加入过期时间的管理,从而实现更加灵活和可控的本地存储机制。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值