[英]Custom Headers added in AngularJS only show on Access-Control-Request-Headers
I am trying to use an interceptor to add a custom header to every request in an AngularJS App using the following code: 我正在尝试使用拦截器使用以下代码向AngularJS应用程序中的每个请求添加自定义标头:
angular.module('app').factory('httpRequestInterceptor', function () {
return {
request: function (config) {
config.headers['testheader'] = 'testheaderworks';
return config;
}
};
});
angular.module('app').config(function ($httpProvider) {
$httpProvider.interceptors.push('httpRequestInterceptor');
});
This code was copied from the answer to this question 该代码是从该问题的答案中复制的
Unfortunately, when I examine the resulting requests, I get the following: 不幸的是,当我检查结果请求时,得到以下信息:
Provisional headers are shown
显示临时标题
Access-Control-Request-Headers:accept, testheader
访问控制请求标头:接受, 测试标头
Access-Control-Request-Method:GET
访问控制请求方法:GET
Origin: http://localhost:61577
来源: http:// localhost:61577
Referer: http://localhost:61577/
引荐来源 : http:// localhost:61577 /
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.86 Safari/537.36
用户代理:Mozilla / 5.0(Windows NT 6.1; WOW64)AppleWebKit / 537.36(KHTML,例如Gecko)Chrome / 46.0.2490.86 Safari / 537.36
I confirmed this in both the network tab in Chrome and on the server side. 我在Chrome的“网络”标签和服务器端都确认了这一点。 Why is the custom header key 'testheader' added to Access-Control-Request-Headers rather than the general headers?
为什么将自定义标头键“ testheader”添加到Access-Control-Request-Headers中而不是常规标头中? What happened to the value?
价值发生了什么? Is there another way to add custom headers to every AngularJS request that avoids this issue?
还有另一种方法可以向每个AngularJS请求添加自定义标头,从而避免此问题?
In case anyone reads this and is having the same issue: 万一任何人读到这并遇到相同的问题:
The problem was that Angular was making a cross origin request, which the browser was preventing. 问题在于Angular正在发出跨源请求,但浏览器无法阻止。 In order to enable this request I had to enable the header on the server side.
为了启用此请求,我必须在服务器端启用标头。 In our case (NodeJs) the code to do this was:
在我们的案例(NodeJs)中,执行此操作的代码是:
app.use(function (req, res, next) {
res.header("Access-Control-Allow-Headers", testheader");
next();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.