如何发送带有公理的授权头

如何通过 axios.js 发送带有令牌的身份验证标头？ 我尝试了一些没有成功的方法，例如:

const header = `Authorization: Bearer ${token}`;
return axios.get(URLConstants.USER_URL, { headers: { header } });

给了我这个错误:

XMLHttpRequest cannot load http://localhost:8000/accounts/user/. Request header field header is not allowed by Access-Control-Allow-Headers in preflight response.

通过设置全局默认值，我已经设法让它工作了，但我猜这不是一个单一请求的最佳方法:

axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;

更新:

科尔的回答帮助我找到了问题所在。我使用的是 Django-cors-headers 中间件，它已经默认处理了授权头部。

但是我能够理解错误消息，并修复了 Axios 请求代码中的一个错误，该错误应该如下所示

return axios.get(URLConstants.USER_URL, { headers: { Authorization: `Bearer ${data.token}` } });
298755 次浏览
小开

试试这个:

axios.get(
url,
{headers: {
"name" : "value"
}
}
)
.then((response) => {
var response = response.data;
},
(error) => {
var status = error.response.status
}
);
小开

对于非简单的 http 请求，你的浏览器会首先发送一个“预飞行”请求(一个 OPTION 方法请求) ，以确定该站点认为应该发送什么样的安全信息(参见 给你的跨源策略规范)。主机可以在飞行前响应中设置的相关报头之一是 Access-Control-Allow-Headers。如果您要发送的任何头文件没有列入规范的白名单头文件列表或服务器的起飞前响应中，那么浏览器将拒绝发送您的请求。

在您的情况下，您试图发送一个 Authorization头，这并不被认为是普遍安全的发送头之一。然后，浏览器发送一个起飞前请求，询问服务器是否应该发送该消息头。服务器要么发送一个空的 Access-Control-Allow-Headers头(这被认为意味着“不允许任何额外的头”) ，要么发送一个不包括 Authorization在允许的头列表中的头。因此，浏览器不会发送您的请求，而是选择通过抛出错误来通知您。

你发现的任何允许你发送这个请求的 Javascript 解决方案都应该被认为是一个 bug，因为它违背了浏览器为了你自己的安全而强制执行的跨源请求策略。

Tl; dr -如果希望发送 Authorization头文件，最好将服务器配置为允许发送。设置您的服务器，以便它用一个 Access-Control-Allow-Headers: Authorization头在该 URL 响应一个 OPTIONS请求。

小开

您几乎是正确的，只需这样调整您的代码

const headers = { Authorization: `Bearer ${token}` };
return axios.get(URLConstants.USER_URL, { headers });

请注意我把反勾放在哪里，我在承载者后面加上了’，如果你肯定要在服务器端处理的话，你可以省略

小开

这对我很有效:

let webApiUrl = 'example.com/getStuff';
let tokenStr = 'xxyyzz';
axios.get(webApiUrl, { headers: {"Authorization" : `Bearer ${tokenStr}`} });
小开

不要调用 axios.get 函数使用方法:

axios({ method: 'get', url: 'your URL', headers: { Authorization: `Bearer ${token}` } })
小开 
res.setHeader('Access-Control-Allow-Headers',
'Access-Control-Allow-Headers, Origin,OPTIONS,Accept,Authorization, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers');

引用原文 : 必须向 setHeader ()添加选项和授权

这个改变已经解决了我的问题，试一试吧！

小开

不需要将其添加到每个请求中，只需将其作为默认配置添加，如下所示。

axios.defaults.headers.common['Authorization'] = `Bearer ${access_token}`
小开

安装 cors中间件。我们试图用我们自己的代码来解决它，但是所有的尝试都失败了。

这让它奏效了:

cors = require('cors')
app.use(cors());

原始链接

小开

你可以试试这个。

axios.get(
url,
{headers: {
"Access-Control-Allow-Origin" : "*",
"Content-type": "Application/json",
"Authorization": `Bearer ${your-token}`
}
}
)
.then((response) => {
var response = response.data;
},
(error) => {
var status = error.response.status
}
);
小开

为您的请求创建一个新的 Axios 实例

  const instance=axios.create({
baseURL:'www.google.com/'
headers:{
'Content-Type':'application/json',
'Acess-Control-Allow-Origin':'*',
'Authorization':`Bearer ${token}`,
'Accept': "application/json"
}
})


await instance.get(url,data)
小开 
const response=await axios(url,
method:"GET"
{
headers: {
"Authorization" : `Bearer ${token}`
}
})
小开

这就是邮递员的工作方式:

headers: {
'Authorization': `Basic ${Buffer.from('username:password').toString('base64')}`
}

提交答案