一、localStorage和sessionStorage统一处理

将数据缓存在前端其实是一件非常危险的事情，所以，设置一些安全措施是非常有必要的，能缓存在 session 级别的数据，就不要缓存在 local 里， 同时考虑过期时间，尽可能的保障用户数据安全性。

1. localStorage和sessionStorage

/**
 * 使用方法：
 * Local为本地缓存，Session为会话缓存
 * import { Local, Session } from '@/utils/Storage'
 *
 */

const EXPIRE_KEY = '__expires';
// 无限时间
const InfinityTime = -1;

class Storage {
  constructor(storageType: string) {
    this.storageType = storageType
  }

  /**
   * 存值，这里注意无需进行Object的转换，存什么都可以，方法内部会自动做类型转换
   * @param {*} key 存储key
   * @param {*} value 存储值
   * @param {*} time 有效时间，默认为永久
   */
  set(key, value, time = InfinityTime) {
    const data = {
      [EXPIRE_KEY]: time === InfinityTime ? time : Date.now() + time,
      value
    };

    global[this.storageType].setItem(key, JSON.stringify(data))
  }

  /**
   * 判断是否含有
   * @param key
   */
  has(key) {
    return this.get(key) !== null
  }


  /**
   * 取值，这里如果是JsonObject类型会自动帮你转回原类型
   * 取值后无需再多做一次类型转换
   * @param {*} key
   * @param {*} defaultVal 默认值
   */
  get(key: string, defaultVal = null) {
    const data = global[this.storageType].getItem(key);
    if (data) {
      const parsedData = JSON.parse(data);
      const expireTime = parsedData[EXPIRE_KEY];
      if (expireTime === InfinityTime || expireTime >= Date.now()) {
        return parsedData.value
      }
      // 过期则清空对应key数据
      this.del(key)
    }
    return defaultVal
  }

  /**
   * 删除
   * @param key
   */
  del(key: string) {
    global[this.storageType].removeItem(key)
  }

  /**
   * 清除所有
   */
  clear() {
    global[this.storageType].clear()
  }
}

export const Local = new Storage('localStorage')

export const Session = new Storage('sessionStorage')