vuejs vuex商店中的授权问题答案

【问题标题】：Having problem with Authorization in vuejs vuex storesvuejs vuex商店中的授权问题
【发布时间】：2020-12-12 03:30:11
【问题描述】：

我正在编写代码来使用 axios 调用 api。因此，对于此代码，我必须向 api 发送一个 otp 以及一个授权令牌。我正在使用 vuex 商店。我收到 406 错误（不适用）。这是我写的代码。

import { isAuthenticated } from './auth'
import axios from 'axios'

export default ({
  state: {
  },
  mutations: {
  },
  getters: {

  },
  actions: {
    VERIFY: (payload) => {
      const userId = isAuthenticated().user._id
      return axios
        .post(apilink, payload, {
          headers: {
            'Content-Type': 'application/json',
            Authorization: `Bearer ${isAuthenticated().token}`,
            Accept: 'application/json'
          }
        }).then(response => {
          console.log(response)
          return response.data
        })
        .catch(error => {
          if (error) {
            console.log(error)
          }
        })
    }
  },
  modules: {
  }
})

<template>
<mdb-btn color="info" @click="verify()">Verify</mdb-btn>
</template>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js">
  data () {
    return {
      value: ''
    }
  },
  methods: {
    verify () {
      this.$store.dispatch('VERIFY', {
        otp: this.value
      }).then(success => {
        console.log(success)
      }).catch(error => {
        console.log(error)
      })
    }
  }
</script>

我认为这是授权部分的问题。请帮帮我。

【问题讨论】：

你能提供更多关于isAuthenticated()的代码吗？
我添加了snipet

标签： javascript vue.js vuex vuex-modules

【解决方案1】：

isAuthenticated 是用于从 localStorage 获取数据的函数

export const isAuthenticated = () => {
  if (localStorage.getItem('auth')) {
    return JSON.parse(localStorage.getItem('auth'))
  }
  return false
}

【讨论】：

【解决方案2】：

删除“Accept: 'application/json'”后，由于标头中的 Accept 参数而出现 406 错误

【讨论】：