Uncaught Error: [$injector:cdep] Circular dependency found: auth <- redirect <- $http <- auth

Question

angular.module('project_tracker')
        .config(['$locationProvider','$routeProvider','$provide',
            'authProvider','jwtInterceptorProvider','$httpProvider',
            function config($locationProvider, $routeProvider,$provide,
                authProvider,jwtInterceptorProvider,$httpProvider){
                authProvider.init({
                    domain: 'xxxxxxxxxxxxxx',
                    clientID: 'xxxxxxxxxxxxxx'
                });
                jwtInterceptorProvider.tokenGetter = function($localStorage){
                    return $localStorage.id_token;
                }
                $locationProvider.hashPrefix('!');
                $routeProvider.
                    when('/projects_list',{
                        template: '<project-list></project-list>'
                    }).
                    when('/building_add',{
                        template: '<building-add></building-add>'
                    }).
                    when('/project_view/:projectId',{
                        template: '<project-view></project-view>'
                    }).
                    when('/project_add',{
                        template: '<project-add></project-add>'
                    }).
                    when('/project_update/:projectId',{
                        template: '<project-update></project-update>'
                    }).
                    when('/profile', {
                        template : '<profile></profile>',
                    })
                function redirect($q,$injector,auth, $localStorage, $location){
                    return {
                        reponseError: function(rejection){
                            if(rejection.status === 401){
                                auth.signout();
                                delete $localStorage.profile;
                                delete $localStorage.id_token;
                                delete $localStorage.projects;
                                delete $localStorage.projects;
                                delete $localStorage.project_number;
                                $location.path('/home');           
                            }
                            return $q.reject(rejection);
                        }
                    }
                }
                $provide.factory('redirect',redirect);                 
                $httpProvider.interceptors.push('redirect');
                $httpProvider.interceptors.push('jwtInterceptor');
            }
            ])
        .run(function($rootScope,auth,$localStorage,jwtHelper,$location){
            $rootScope.$on('$locationChangeStart',function(){
                var token = $localStorage.id_token;
                if(token){
                    if(!jwtHelper.isTokenExpired(token)){
                        if(!auth.isAuthenticated){
                            auth.authenticate($localStorage.id_token,token);
                        }
                    }
                }
                else {
                    $location.path('/home');
                }
            })
        })

I am following these tutorials , after I added the redirect function this error :

Circular dependency found: auth <- redirect <- $http <- auth
                http://errors.angularjs.org/1.5.7/$injector/cdep?p0=auth%20%3C-%20redirect%20%3C-%20%24http%20%3C-%20auth

I am new to this and I do not understand much of it.

Answer 1

You have a circular dependency between $http and your auth ( Service or Factory).

What you should do is instead of directly DI the auth, try using $injector in redirect interceptor.

 var auth= $injector.get('auth');