AngularJS $ http.interceptors.push Error on crashes: [$ injector: unpr]
I am trying to set an access token to a header after a successful login. I am trying to achieve this 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);
}
};
});
source to share
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);
}]);
source to share
when you clear the source it is TokenInterceptor
resolved a
which cannot be found in angular context.
you can use ng-annotate to preprocess your source before uglify, it will automatically transform your srouse code to use explicit annotations (array) style myApp.factory('TokenInterceptor', ['$q', '$window', '$location', 'AuthenticationService', function ($q, $window, $location, AuthenticationService){...}])
for minimal security
ng-annotate
It has grunt
and gulp
plugins, as well as
source to share