Circular dependency found: $http <- $templateFactory <- $view <- $state Circular dependency found: $http <- $templateFactory <- $view <- $state angularjs angularjs

Circular dependency found: $http <- $templateFactory <- $view <- $state


It appears that $state service is resulting in a circular dependency with the $http service. This may be caused by the fact that the templateFactory (see https://github.com/angular-ui/ui-router/blob/master/src/templateFactory.js) is being injected with the $http service in addition to the interceptor itself being composed with the $http service.

To get around this circular dependency issue, you can use the $injector service to wire up the $state service to your interceptor. See the revised code:

/* Look for 401 auth errors and then redirect */module.factory('authHttpResponseInterceptor', ['$q','$location', '$injector', function($q, $location, $injector) {    return {        response: function(response){            if (response.status === 401) {            }            return response || $q.when(response);        },        responseError: function(rejection) {            var reservedPaths = ['/', '/mycube', '/connect', '/event'];            if (rejection.status === 401 && _.contains(reservedPaths, $location.path().trim())) {                var stateService = $injector.get('$state');                stateService.go('home');            }            return $q.reject(rejection);        }    };}]);

You can learn more about the $injector service here: https://docs.angularjs.org/api/auto/service/$injector

IMPORTANT

I would recommend using the state change events (see https://github.com/angular-ui/ui-router/wiki#state-change-events) to watch for errors using $stateChangeError and inspecting the error returned from the 401.


Here is the simplest solution I did and it worked. Inside the factory write:

var $http = $injector.get("$http");

and then use $http as you normally would.

NOTE: If you don't have $injector available in your factory simply inject it as follow

.factory('authHttpResponseInterceptor',['$q','$location','$injector', function($q,$location,$injector) {}])