localstorage设置过期时间的用法

一、Window.localStorage

（1）只读的localStorage 属性允许你访问一个Document 源（origin）的对象
Storage；存储的数据将保存在浏览器会话中。
（2）与sessionStorage区别：存储在 localStorage的数据可以长期保留；而当页面会话结束——也就是说，当页面被关闭时，存储在 sessionStorage 的数据会被清除。

二、语法

localStorage 中的键值对总是以字符串的形式存储
我们可以使用它提供的getItem、setItem、removeItem、clear这几个API对当前域名下的本地Storage对象进行“增读删”操作。美中不足的是，相比于cookie，localStorage不能设置过期时间。

三、解决方法

在local Storage中传入一个时间，把当前时间与传入的时间作比较，如果过当前时间大于设置的时间，则localStorage已过期

    // name:localstorage的key
    // data:localstorage的value
    // expire:localstorage的过期时间，默认是1天后过期

    //设置缓存
    const localStorageSet = (name, data, expire =new Date().getTime() + expire * 60 * 60 * 1000) => {
      const obj =
        data,
        expire
      };
    localstorage.setItem(name, JSON.stringify(obj)) ;

    //读取缓存
    const localstorageGet = name => {
      const storage = localstorage.getItem(name) ;
      const time = new Date().getTime();

      let result = {};
      if (storage) {
        const obj = JSON.parse (storage);
        if (time < obj.expire){
          result = obj.data;
        }
        else{
          localstorage.removeItem(name);
          return result;
          }
      }
    }