AngularJS $http.interceptors.push Uncaught Error: [$injector:unpr]

Question

I'm trying to set access-token to the header after a login is successful. I'm trying to achieve it by using interceptors but getting this error:

Uncaught Error: [$injector:unpr] Unknown provider: aProvider <- a <- TokenInterceptor <- $http <- $compile

JS

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

myApp.factory('TokenInterceptor', function ($q, $window, $location, AuthenticationService) {
    return {
        request: function (config) {
            config.headers = config.headers || {};
            if ($window.sessionStorage.token) {
                config.headers.Authorization = 'Bearer ' + $window.sessionStorage.token;
            }
            return config;
        },

        requestError: function(rejection) {
            return $q.reject(rejection);
        },

        response: function (response) {
            return response || $q.when(response);
        },

        //Revoke client authentication if 401 is received

        responseError: function(rejection) {
            console.log("Rejecton !");
            console.log(rejection);

            if (rejection != null && rejection.status === 401 && ($window.sessionStorage.token || AuthenticationService.isLogged)) {
                console.log("Revoked !");
                delete $window.sessionStorage.token;
                AuthenticationService.isLogged = false;
                $location.path("/admin/login");
            }

            return $q.reject(rejection);
        }
    };
});

looks like the problem is caused by minified version, are your using ng-annotate to process your source before uglifying? — hjl
– hjl, Commented Jan 2, 2015 at 6:03

Shashank Agrawal · Accepted Answer · 2015-01-02 07:52:51Z

yApp.config(['$httpProvider', function ($httpProvider) {

    var interceptor = ['$q', '$window', '$location', '$injector', function($q, $window, $location, $injector) {

        return {
            request: function (config) {
                config.headers = config.headers || {};
                if ($window.sessionStorage.token) {
                    config.headers.Authorization = 'Bearer ' + $window.sessionStorage.token;
                }
                return config;
            },

            requestError: function(rejection) {
                return $q.reject(rejection);
            },

            response: function (response) {
                return response || $q.when(response);
            },

            // Revoke client authentication if 401 is received

            responseError: function(rejection) {
                console.log(rejection);
                // Dynamically get the service since they can't be injected into config
                var AuthenticationService = $injector.get('AuthenticationService');

                if (rejection != null && rejection.status === 401 && ($window.sessionStorage.token || AuthenticationService.isLogged)) {
                    delete $window.sessionStorage.token;
                    AuthenticationService.isLogged = false;
                    $location.path("/login");
                }

                return $q.reject(rejection);
            }
        };
    }];

    $httpProvider.interceptors.push(interceptor);
}]);

hjl · Accepted Answer · 2015-01-02 06:50:29Z

0

when you uglify the source , TokenInterceptor is resolved to a which can't be found in angular context.

you can use ng-annotate to pre-process your source before uglify, it will auto convert your srouce code to use explicit annotations (array) style myApp.factory('TokenInterceptor', ['$q', '$window', '$location', 'AuthenticationService', function ($q, $window, $location, AuthenticationService){...}])to be minified-safe

ng-annotate has grunt and gulp plugins as well

edited Jan 2, 2015 at 6:50

answered Jan 2, 2015 at 6:05

hjl

2,8023 gold badges20 silver badges26 bronze badges

Collectives™ on Stack Overflow

AngularJS $http.interceptors.push Uncaught Error: [$injector:unpr]

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