带有承载令牌的 VueJS GET 请求答案

【问题标题】：VueJS GET request with Bearer token带有承载令牌的 VueJS GET 请求
【发布时间】：2019-05-11 08:44:59
【问题描述】：

我正在使用 VueJS 尝试使用 Kentico Delivery Preview API，它允许您通过提交不记名令牌进行授权 (https://developer.kenticocloud.com/reference#authentication) 来获取未发布的内容。但是，无论我做什么，我都会收到 401 响应。 PROJECT_ID、ITEM_NAME 和 TOKEN 都是正确的，取自项目，所以不是拼写错误。我承认我对身份验证没有太多经验，但我们将不胜感激：

var app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue!'
    },
    mounted () {
        axios
          .request({
            url: '/items/ITEM_NAME',
            method: 'get',
            baseURL: 'https://preview-deliver.kenticocloud.com/PROJECT_ID',
            headers: {
                'Authorisation': 'Bearer TOKEN'
            }
          })
          .then(response => {
            console.log(response.data)
          })
      }

})

【问题讨论】：

第一次更改为使用 z 进行授权
天哪。这就是我成为英语的原因哈哈！谢谢！

标签： vue.js axios kentico-kontent

【解决方案1】：

正如 Walter 在 cmets 中指出的那样，我用 S 而不是 Z 拼写 Authorization.. 因为我是英国人。哎呀。

【讨论】：

我现在不能；我必须等待 2 天才能接受我自己的答案（！）。禁令解除后，我会在 2 小时内将其标记为接受。请在此期间投票！

【解决方案2】：

在您的请求之前使用 create 配置 axios 标头

const TOKEN = 'Token';
const BASEURL = 'https://preview-deliver.kenticocloud.com/PROJECT_ID';
const ENDPOINT = '/items/ITEM_NAME';

axios.create({
        baseURL: BASEURL,
        headers: {
            'Content-Type': 'application/json',
            'Authorization': 'Bearer '+TOKEN
        }
    })
    .get(ENDPOINT)
    .then(res => {
            console.log(res);
    });

【讨论】：