如何实现可过期的 localStorage 数据?

实现可过期的 localStorage 数据，可以通过在存储数据时附加过期时间，并在读取数据时检查是否过期。

以下是一个简单的实现方法：

1. 存储数据

在存储数据时，可以将数据和过期时间一起存储。在本例中，使用一个对象来保存数据和过期时间的时间戳。

示例代码

function setItemWithExpiry(key, value, ttl) {
  const now = new Date();
  const item = {
    value: value,
    expiry: now.getTime() + ttl, // ttl 是过期时间（以毫秒为单位）
  };
  localStorage.setItem(key, JSON.stringify(item));
}

2. 读取数据

读取数据时，需要检查数据是否已过期。如果数据已过期，则从 localStorage 中删除它，并返回 null 或其他标识过期的数据。

示例代码

function getItemWithExpiry(key) {
  const itemStr = localStorage.getItem(key);

  // 如果不存在数据，则直接返回 null
  if (!itemStr) {
    return null;
  }

  const item = JSON.parse(itemStr);
  const now = new Date();

  // 检查是否过期
  if (now.getTime() > item.expiry) {
    // 数据过期，删除数据
    localStorage.removeItem(key);
    return null;
  }

  return item.value;
}

3. 使用示例

存储数据

// 存储数据，过期时间为 5 分钟（300000 毫秒）
setItemWithExpiry("myKey", "myValue", 300000);

读取数据

const value = getItemWithExpiry("myKey");
console.log(value); // 如果未过期则输出 'myValue'，否则输出 null