Using AngularJs in order to retrieve a header from the response and set it on all requests

Question

I am trying to use Angularjs in order to retrieve the csrf token from one of the response\'s header and set it on all requests.

I h

Answer 1

I think you can do it like this in config function:

.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.xsrfHeaderName = 'X-CSRF-TOKEN';
    $httpProvider.interceptors.push(function() {
        return {
            response: function(response) {
                $httpProvider.defaults.headers.common['X-CSRF-TOKEN'] = response.headers('X-CSRF-TOKEN');
                return response;
            }
        }    
    });
}]);

Answer 2

You can use the same interceptor to intercept any request generating from your application and inject the token into it. For example:

.factory('csrfResponseInterceptor', [function () {
        var token = null;

        return{
            request: function(config){
                if(token){
                   config.headers['X-CSRF-TOKEN'] = token;
                }
                return config;
            },
            response: function(response){
                token = response.headers('X-CSRF-TOKEN');
                return response;
            }
        }
    }])