在 axios 中设置 API 客户端授权密钥时出现问题

Question

API是使用Laravel开发的，我目前正在使用Laravel Passport实现授权逻辑。 客户端应用程序是一个 Vuejs 应用程序，Http 调用是使用 axios 完成的。

护照完美地返回了一个令牌(我使用的是客户端凭据类型的授权(。 Axios 提供了一种通过设置数组来设置默认标头的方法axios.defaults.headers.common。这是我的 axios 调用(在引导中实现.js(

async function a() {
var ret = "";
await axios
.post("/oauth/token", {
"client_id": 7,
"client_secret": "2GmvfxQev7AnUyfq0Srz4jJaMQyWSt1iVZtukRR6",
"grant_type": "client_credentials",
"scope": "*"
})
.then((resp) => {
ret =  resp.data.access_token;
})
return ret; 
}
a().then((res) => {
console.log(res) //this perfectly loggs the token to the console.
axios.defaults.headers.common["Authorization"] = "Bearer " + res
})

但是，所有后续 axios 调用都缺少持有者令牌标头。

Answer 1

您可以尝试使用自定义配置创建一个 axios 实例： https://github.com/axios/axios#creating-an-instance

例：

const axios = require('axios').create({
headers: {
'Authorization': 'Bearer: ' + token
}
});

并像往常一样使用它：

axios.get(url).then(resp => {
//response handler
});
axios.post(url, data).then(resp => {
//response handler
});