Question

使用Vue Webpack模板，尝试进行JWT身份验证。到目前为止，我已经完成了什么：

“ src / auth / index.js”：

  // Send a request to the login URL and save the returned JWT
  login (creds, redirect) {
    axios.post(LOGIN_URL, creds, (data) => {
      localStorage.setItem('access_token', data.access_token)

      this.user.authenticated = true

      // Redirect to a specified route
      if (redirect) {
        router.push(redirect)
      }
    }).error((err) => {
      context.error = err
    })
  },

我正在从LoginPage.vue调用此函数：

  methods: {
    login () {
      var credentials = {
        username: this.credentials.username,
        password: this.credentials.password
      }
      // We need to pass the component's this context
      // to properly make use of http in the auth service
      auth.login(this, credentials, 'requests')
    }
  }

提交表单时，数据已提交，但是在控制台中出现以下错误：

TypeError: __WEBPACK_IMPORTED_MODULE_1_axios___default.a.post(...).error is not a function

JWT令牌也未保存在本地存储中，我在做什么错了？

Answer 1

重写登录功能：

  login (context, creds, redirect) {
    axios.post(LOGIN_URL, creds)
      .then((response) => {
        localStorage.setItem('access_token', response.data.access_token)

        this.user.authenticated = true

        if (redirect) {
          router.push(redirect)
        }
      }).catch((err) => {
        context.error = err.response.data
      })
  },

现在一切正常。

使用AXIOS进行JWT身份验证

1 个答案: