带有 CORS 和自定义标头的 AngularJS

Question

我正在使用 Angular $HTTP 向远程 API 服务 (SmartyStreets.com) 发出 CORS 请求。我已经按照有据可查的方式设置了默认值。

.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
}])

当我发出一个没有自定义标头的普通请求时，一切都按预期工作。

// This works as expected
$http({method: 'get', url: $scope.addr.url, headers: {}})

但是，我现在需要设置一些额外的自定义标题。但是设置自定义标头会破坏 CORS 请求。

// this results in the browser 404 error:
// No 'Access-Control-Allow-Origin' header is present on the requested resource
$http({method: 'get', url: $scope.addr.url, 
headers: {'x-standardize-only': 'true', 'x-  include-invalid': 'true'}})

几天来我一直试图弄清楚这一点......卡住了。有谁知道如何解决这个问题？

谢谢！！

Answer 1

您的服务器需要正确响应浏览器代表您发出的 OPTIONS 请求，以确定 CORS 请求是否有效。它需要包含一个Access-Control-Allow-Headers标头，其中包含正确的信息。请参阅： https: //developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS#Preflighted_requests