登录后用sessionStorage储存token值并添加及退出登录后的清除

举个登录的例子

login () {
      this.$refs.loginFormRef.validate(async (valid) => {
        if (!valid) return
        // // login是请求的地址；this.loginForm是请求的参数，是一个对象。
        const { data: res } = await this.$http.post('login', this.loginForm)
        if (res.meta.status !== 200) return this.$message.error('登录失败')
        this.$message.success('登陆成功')
        // 登录成功之后的token保存到客户端的sessionStorage中
        // 项目中除了登录之外的其他API接口，必须在登陆成功之后才能访问；
        // token只应该在当前网站打开期间生效，所以token要保存到客户端的sessionStorage中。
        window.sessionStorage.setItem('token', res.data.token)
        // 通过编程式导航跳转到后台主页，路由地址是 /home
        this.$router.push('/home')
      })
    }

// 通过拦截器添加token验证
axios.interceptors.request.use(config => {
  console.log(config)
  config.headers.Authorization = window.sessionStorage.getItem('token')
  return config   // 在最后必须return config
})

localStorage 和 sessionStorage一些方法

localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。

sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。

保存数据语法：
window.sessionStorage.setItem("key", "value");
读取数据语法：
var lastname = window.sessionStorage.getItem("key");
删除指定键的数据语法：
window.sessionStorage.removeItem("key");
删除所有数据：
window.sessionStorage.clear();