Custom HTTP headers are always added under "Access-Control-Request-Headers"

I am new to Angular JS. I am writing a simple client to fetch data from an HTTP endpoint.

All the headers I have set are sent over the wire under the header Access-Control-Request-Headers

, but not as actual HTTP headers in the request.

delete $http.defaults.headers.common['X-Requested-With'];
var config = {
  headers:  {
    'customHeader1': 'value1'
$http.defaults.headers.get = {
  'customHeader2': 'value2'
$http.get("http://localhost:8280/abc",config).success(function(data) {
  // alert(data);
  $scope.names = data.records;
}).error(function(response, data, status, header) {



source to share

1 answer

Could you please try this suggestion from the official Angular JS documentation :

To explicitly remove the header automatically added through $httpProvider.defaults.headers

for every request, use the headers property by setting the desired header to undefined. For example:

var req = {
 method: 'POST',
 url: '',
 headers: {
   'Content-Type': undefined
 data: { test: 'test' }

$http(req).then(function(){...}, function(){...});




All Articles