localStorage设置过期时间

廿七の笔记

于 2020-12-14 16:28:22 发布

阅读量415

点赞数 1

CC 4.0 BY-SA版权

文章标签： typescript html5

本文链接：https://blog.csdn.net/qq_40041944/article/details/111176551

该博客介绍了如何在前端使用localStorage实现数据的过期管理。通过在存储数据时附加过期时间，并在查询时检查这个时间，可以确保过期的数据不被使用，而是直接清除。提供的代码示例展示了如何创建一个包含setItem、getItem、removeItem和clear方法的存储对象，以方便管理和清理localStorage中的数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

localStorage设置过期时间

步骤：

在存储原始数据时附带上过期时间
查询数据时，将当前时间与存储的过期时间进行比较
如果当前时间大于存储的过期时间，则返回null并从存储中删除该条数据，否则，返回原始信息。

// 这里 expired过期时间单位为 分钟
const storage = {
  setItem: function (key: string, value: any, expired?: number) {
    let data = expired ? { value, expired: Date.now() + expired * 60 * 1000 } : { value };
    localStorage.setItem(key, JSON.stringify(data));
  },
  getItem: function (key: string) {
    if (!localStorage.getItem(key)) return;
    let data = JSON.parse(localStorage.getItem(key) || '');
    if (data.expired && Date.now() > data.expired) {
      this.removeItem(key);
      return;
    }
    return data.value;
  },
  removeItem: function (key: string) {
    localStorage.removeItem(key);
  },
  clear: function () {
    localStorage.clear();
  }
};

export default storage;