Sunday, June 2, 2024
 Popular · Latest · Hot · Upcoming
39
rated 0 times [  41] [ 2]  / answers: 1 / hits: 46433  / 11 Years ago, wed, december 18, 2013, 12:00:00

I'm trying to write a HTTP interceptor for my AngularJS app to handle authentication.



This code works, but I'm concerned about manually injecting a service since I thought Angular is supposed to handle this automatically:



    app.config(['$httpProvider', function ($httpProvider) {
$httpProvider.interceptors.push(function ($location, $injector) {
return {
'request': function (config) {
//injected manually to get around circular dependency problem.
var AuthService = $injector.get('AuthService');
console.log(AuthService);
console.log('in request interceptor');
if (!AuthService.isAuthenticated() && $location.path != '/login') {
console.log('user is not logged in.');
$location.path('/login');
}
return config;
}
};
})
}]);


What I started out doing, but ran into circular dependency problems:



    app.config(function ($provide, $httpProvider) {
$provide.factory('HttpInterceptor', function ($q, $location, AuthService) {
return {
'request': function (config) {
console.log('in request interceptor.');
if (!AuthService.isAuthenticated() && $location.path != '/login') {
console.log('user is not logged in.');
$location.path('/login');
}
return config;
}
};
});

$httpProvider.interceptors.push('HttpInterceptor');
});


Another reason why I'm concerned is that the section on $http in the Angular Docs seem to show a way to get dependencies injected the regular way into a Http interceptor. See their code snippet under Interceptors:



// register the interceptor as a service
$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
return {
// optional method
'request': function(config) {
// do something on success
return config || $q.when(config);
},

// optional method
'requestError': function(rejection) {
// do something on error
if (canRecover(rejection)) {
return responseOrNewPromise
}
return $q.reject(rejection);
},



// optional method
'response': function(response) {
// do something on success
return response || $q.when(response);
},

// optional method
'responseError': function(rejection) {
// do something on error
if (canRecover(rejection)) {
return responseOrNewPromise
}
return $q.reject(rejection);
};
}
});

$httpProvider.interceptors.push('myHttpInterceptor');


Where should the above code go?



I guess my question is what's the right way to go about doing this?



Thanks, and I hope my question was clear enough.


More From » angularjs

 Answers
6

You have a circular dependency between $http and your AuthService.



What you are doing by using the $injector service is solving the chicken-and-egg problem by delaying the dependency of $http on the AuthService.



I believe that what you did is actually the simplest way of doing it.



You could also do this by:




  • Registering the interceptor later (doing so in a run() block instead of a config() block might already do the trick). But can you guarantee that $http hasn't been called already?

  • Injecting $http manually into the AuthService when you're registering the interceptor by calling AuthService.setHttp() or something.

  • ...


[#73685] Monday, December 16, 2013, 11 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
jeremiahianx

Total Points: 629
Total Questions: 106
Total Answers: 112

Location: Djibouti
Member since Sun, Feb 27, 2022
2 Years ago
;