Question

我正在尝试使用axios来通过需要授权标头的API进行GET请求。

这是我当前的代码

我当前的代码：

data () {
   return {
      listings: [],
      AuthStr : 'Bearer ' + JSON.parse(localStorage.getItem('token')),
   }
},
created () {
   axios.get(`url`, { 'headers': { 'Authorization': AuthStr } })
   .then((response => {
       this.listings = response.data;
   })
   .catch((error) => {
       console.log(error)
   })
}

它向我显示403错误，我不知道为什么。

Answer 1

有几种向请求添加标头的方法。

对于单个请求：

let config = {
  headers: {
    Authorization: value,
  }
}


axios.get(URL, config).then(...)

您需要致电data().AuthStr才能使您的令牌出现错字。

您创建的函数将为

created () {
   axios.get(`url`, { 'headers': { 'Authorization': data().AuthStr } })
   .then((response => {
       this.listings = response.data;
   })
   .catch((error) => {
       console.log(error)
   })
}

Answer 2

应该是：

axios.get(`url`, { 'headers': { 'Authorization': this.AuthStr } })

Answer 3

获取JSON.parse的值时，您正在使用AuthStr。 JSON.parse返回一个对象。尝试将其删除，如果您使用的是正确的Auth令牌，它应该可以工作。

在vue App中将Axios GET与授权标头一起使用

3 个答案: