AngularJS with CORS and custom headers

Viewed 7343

I am using Angular $HTTP to make a CORS request to a remote API service (SmartyStreets.com). I have set the defaults as is well-documented.

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

When I make a plain request with no custom headers everything works as expected.

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

However, I need to now set some additional custom headers. But setting the custom headers breaks the CORS request.

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

I've been trying to figure this out for a couple days now...stuck. Anyone know how to solve this problem?

Thank you!!

1 Answers
Related