Strip header fields from a post request using $http in an AngularJS app

Question

In an AngularJS app I'm posting a form to a payment gateway. I have a header field called "Authorization" to pass my session token to the backend API.

When trying to make a request to the payment gateway I get the following error:

XMLHttpRequest cannot load https://transact.nab.com.au/test/directpostv2/authorise. Request header field Authorization is not allowed by Access-Control-Allow-Headers.

When making the same request using Postman everything works fine, with a 200 status code.

I've created a plunkr for a quick demo which also gets a 200 status http://plnkr.co/edit/8Ts6s0VDTTUVVC9dbCJC

$http({
    method: 'POST',
    url: authoriseURL,
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
    },
    data: nabPaymentData
}).
success(function (response, status, headers) {
    alert('Success:' + response + ' status:' + status + ' headers:' + headers);
}).
error(function (err, status, headers) {
    alert('Error:' + err + ' status:' + status + ' headers:' + headers);
});

Is there a way to strip header fields for one single post request?

You can strip header for every post request before it reach server using interceptor. But actually I don't get it why would you want to remove the header if it is needed. — Jon Kartago Lamida
– Jon Kartago Lamida, Commented Nov 11, 2014 at 6:31
I only want to remove the header for making the post to the external URL which is a payment gateway. Would it be possible to intercept for just that one request? — Drew Ford
– Drew Ford, Commented Nov 11, 2014 at 20:03

Jon Kartago Lamida · Accepted Answer · 2014-11-12 03:57:47Z

As my comment above you can use interceptor to remove auth header only for request to payment gateway. The solution will be like this. First we define interceptor using factory. Later we push the interceptor in angular config.

app.factory('myInterceptor', ['$log', function($log) {
    return {
    // optional method
    'request': function(config) {
      $log.debug(config.url);
      // if request to payment gateway, delete the auth header
      if(config.url.indexOf('https://transact.nab.com.au') > -1) {
        $log.debug('before deleting auth header');
        $log.debug(config.headers);
        delete config.headers.Authorization;
        $log.debug('after deleting auth header');
        $log.debug(config.headers);
      }
      $log.debug(config.url);
      $log.debug(config.headers);
      // do something on success
      return config;
    },


  };
}]);

app.config(['$httpProvider', function($httpProvider) {
    $httpProvider.interceptors.push('myInterceptor');
}]);

ivan.sim · Accepted Answer · 2014-11-11 20:39:13Z

0

You can remove the Authorization field for just that POST request by setting it to undefined:

$http({
  method: 'POST',
  url: authoriseURL,
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    'Authorization': undefined
  },
  data: nabPaymentData
});

answered Nov 11, 2014 at 20:39

ivan.sim

9,3668 gold badges51 silver badges64 bronze badges

Collectives™ on Stack Overflow

Strip header fields from a post request using $http in an AngularJS app

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related