Vue使用localStorage设置token及过期时间

login.vue

methods: {
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.$notify({
              title: '登录成功！',
              type: 'success',
              duration: 1000
            });
            // 本地存储token(uid)数据；清除token：localStorage.removeItem('token');
            let paramss = {name: 'token', value: this.ruleForm.username};
            var datas = Object.assign(paramss, { startTime: new Date().getTime() });
            localStorage.setItem("token", JSON.stringify(datas));
            // 延迟1s 跳转页面
            setTimeout(()=>{this.$router.push({name: "index"});},1000)
          } else {
            return false;
          }
        });
      }
    },

main.js

// 设置登录过期时间（一天）
let EXPIRESTIME = 86400000


// 校验登录
router.beforeEach(function(to, from, next) {
  if (to.meta.needLogin) {
    //页面是否登录，本地存储中是否有token(uid)数据，否：跳转登录页面
    let item = localStorage.getItem("token");
    try {
        item = JSON.parse(item);
    } catch (error) {
        // eslint-disable-next-line no-self-assign
        item = item;
    }
    if (item) {
      let date = new Date().getTime();
      // 如果大于就是过期了，如果小于或等于就还没过期
      if (date - item.startTime > EXPIRESTIME) {
          localStorage.removeItem('token');
          next({
            name: "login"
          });
      } else {
        next();
      }
    } else {
      next({
        name: "login"
      });
    }
  } else {
    next();
  }
});