使用Angular服务的请求拦截器对REST get调用进行简单身份验证

Question

I want to pass in a username and password combination that is needed to make a REST call to an api.

Controller.js

var app = angular.module('myApp', []);

//The service to put the interceptor configuration on (not on all $http method calls)
app.factory('getCallsApi', ['$http', function($http) {
    return {
        get: function(callback) {
            $http.get(/* REST URI */).success(function(data) {
                callback(data);
            });  
        }
    }
}]);

var Interceptor = function($q) {
    return {
        request: function(config) {
            //TODO: Pass in username and password (hardcoded) to get through authentication

        },
        requestError: function(rejection) {

        },
        response: function(config) {
            //TODO: ADD Cross origin headers

        },
        responseError: function(rejection) {

        }
    }
}

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

myApp.controller('appController', ['$scope','getCallsApi', function($scope, getCallsApi) {
  getCallsApi.get(function(data) {
    console.log(data);
  });
}]);

I am currently receiving two errors in the console. First is a 401 status for unauthorized access and an error about cross origin headers not found on the requested resource. I cannot put the X origin headers on the requested resource myself because I dont have rights to edit that response of the API.

Answer 1

Not speaking for the cross origin issue, but here is how to add something to the request headers. In my case, I pass in a token that is stored in localstorage. We bind that value to an angular constant and inject it to the interceptor service:

.constant('AUTH_TOKEN', localStorage.getItem('myapp.authToken'))

And in your interceptor:

    var Interceptor = function ($q) {
        return {
            request: function (config) {

                if (AUTH_TOKEN) {
                    config.headers['Authorization'] = 'Token ' + AUTH_TOKEN;
                }
                return config;
            }
        }
    }