在vue中使用隐式授权流从spotify api获取数据

我是vuejs的新手，正在使用api 我想使用隐式授权流连接到spotify api 我重定向用户以授权页面并获取访问令牌，然后使用axios实例设置头

这段代码位于main.js中

import axios from 'axios'
export const base = axios.create({
  baseURL: 'https://api.spotify.com/v1',
  header: {
      'Authorization' : 'Bearer ' + store.state.accessToken,
  }
});
Vue.prototype.$http = base;

这是在我的一个组件中，我试图从api获取数据

mounted() {
            this.$http.get('/artists/1vCWHaC5f2uS3yhpwWbIA6')
                .then(data => this.albums = data)
                .catch(e => this.error = e)
        }

但服务器响应401错误，并显示以下消息：
错误：请求失败，状态代码为401

---

那么您怎么看？

401

（未经授权）意味着您的令牌在此情况下无效。假设您正在

main.js

中设置全局头（在您收到访问令牌之前），那么您的头很可能包含

授权

头的空字符串。请注意，

store.state.accessToken

在您使用它的方式中不是被动的。@tony19哦，太酷了，我不知道这一点。我正在使用Vuex管理状态。这意味着我不能使用Vuex管理我的访问令牌，对吗？我使用这行代码导入store

import{store}from./store/store'

好吧，您仍然可以使用Vuex，并且在状态中有一个被动访问令牌，但这不是实现的方法。我想这才是你想要的答案：）@tony19是的，谢谢你的回答，它真的很有帮助：D

401

（未经授权）意味着你的令牌在这种情况下无效。假设您正在

main.js

中设置全局头（在您收到访问令牌之前），那么您的头很可能包含

授权

头的空字符串。请注意，

store.state.accessToken

在您使用它的方式中不是被动的。@tony19哦，太酷了，我不知道这一点。我正在使用Vuex管理状态。这意味着我不能使用Vuex管理我的访问令牌，对吗？我使用这行代码导入store

import{store}from./store/store'

好吧，您仍然可以使用Vuex，并且在状态中有一个被动访问令牌，但这不是实现的方法。我想这才是你想要的答案：）@tony19是的，谢谢你的回答，它真的很有帮助：D