Token vue js，jwt

hs1rzwqc 于 7个月前发布在 Vue.js

关注(0)|答案(1)|浏览(84)

我想问，我如何使用localstorage中的token成为可以在所有功能中使用的token。This token from localstorage And this token from auth before。我想使用localstorage中的token访问所有功能别名token localstorage成为token global。这是我的登录表单代码：

async handleSubmit () {
      // const self = this
      console.log('on handleSubmit()')
      this.$refs.loginForm.validate(async (valid) => {
        if (this.loginLoading) return
        this.loginLoading = true
        try {
          if (valid) {
            const { userName, password } = this.form
            const res1 = await this.handleLogin({ userName, password })
            const res2 = await this.getUserInfo()
            console.log('>>> handleSubmit:33', { res1, res2 })
            console.log('>>> confighomename', this.$config.homeName)
            const tokenstring = JSON.stringify(res1.access_token)
            localStorage.setItem('token', tokenstring)

            this.$emit('on-login-success', {
              username: this.form.userName,
              password: this.form.password
            })

字符串
此handlelogin代码：

async handleLogin ({ commit }, { userName, password }) {
      try {
        userName = userName.trim()

        const res = await RestClient.request({
          url: '/api/auth/login', method: 'POST', data: { username: userName, password }
        })

        const data = res.data

        commit('setTagNavList', [])
        commit('setToken', data.id)
        commit('setData', data)

        return data
      } catch (error) {
        console.error('>>> Error in handleLogin API: ', error)
        throw error
      }

型
那么我可以在哪里使用令牌从本地存储到每个功能？
来自本地存储令牌取代了授权，可以在任何地方使用

vue.js

来源：https://stackoverflow.com/questions/77478542/token-vue-js-jwt

1条答案

按热度按时间

nnsrf1az1#

要在Vue.js应用程序中使用存储在localStorage中的JWT token作为全局token，首先您应该将token存储在某个地方（localStorage或cookie），然后通过拦截器将其附加到您的请求中。因此，通常在登录后您应该：

localStorage.setItem('token', JSON.stringify(res1.access_token));

字符串
然后（假设使用Axios）：

function getToken() {
  return JSON.parse(localStorage.getItem('token'));
}
axios.interceptors.request.use(config => {
  const token = getToken();
  if (token) {
    config.headers.Authorization = `Bearer ${token}`;
  }
  return config;
});

型
大多数情况下，你的token保存在本地存储中，你在拦截器中处理适当的逻辑。

赞(0）回复(0）举报 7个月前

我来回答

Token vue js，jwt

1条答案

相关问题

热门标签

最新问答