AngularJS中添加的自定义标题仅显示在Access-Control-Request-Headers上

Question

我正在尝试使用拦截器使用以下代码为AngularJS App中的每个请求添加自定义标头:

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');
});

此代码是从这个问题的答案中复制而来的

不幸的是,当我检查结果请求时,我得到以下内容:

显示临时标题

Access-Control-Request-Headers:accept,testheader

访问控制请求-方法:GET

来源:http:// localhost:61577

推荐人:http:// localhost:61577 /

User-Agent:Mozilla/5.0(Windows NT 6.1; WOW64)AppleWebKit/537.36(KHTML,与Gecko一样)Chrome/46.0.2490.86 Safari/537.36

我在Chrome的网络标签和服务器端都确认了这一点.为什么自定义标题键'testheader'被添加到Access-Control-Request-Headers而不是一般标题？价值发生了什么变化？是否有另一种方法可以为每个AngularJS请求添加自定义标头以避免此问题？

Answer 1

如果有人读到这个并且遇到同样的问题:

问题是Angular正在制作一个交叉源请求,浏览器正在阻止它.为了启用此请求,我必须在服务器端启用标头.在我们的例子中(NodeJs),执行此操作的代码是:

app.use(function (req, res, next) {
    res.header("Access-Control-Allow-Headers", testheader");
    next();
});