[解決済み] http インターセプターに $state (ui-router) を注入すると循環依存が発生する

質問

実現したいこと

httpリクエストが401エラーを返した場合に、特定の状態（ログイン）に遷移させたいと考えています。そのため、$httpインターセプターを作成しました。

問題点

インターセプターに '$state' を挿入しようとすると、循環依存関係が発生します。なぜ、そしてどのように私はそれを修正するのですか？

コード

//Inside Config function

    var interceptor = ['$location', '$q', '$state', function($location, $q, $state) {
        function success(response) {
            return response;
        }

        function error(response) {

            if(response.status === 401) {
                $state.transitionTo('public.login');
                return $q.reject(response);
            }
            else {
                return $q.reject(response);
            }
        }

        return function(promise) {
            return promise.then(success, error);
        }
    }];

    $httpProvider.responseInterceptors.push(interceptor);

どのように解決するのですか？

修正方法

この場合 $injector サービスへの参照を取得します。 $state サービスへの参照を取得します。

var interceptor = ['$location', '$q', '$injector', function($location, $q, $injector) {
    function success(response) {
        return response;
    }

    function error(response) {

        if(response.status === 401) {
            $injector.get('$state').transitionTo('public.login');
            return $q.reject(response);
        }
        else {
            return $q.reject(response);
        }
    }

    return function(promise) {
        return promise.then(success, error);
    }
}];

$httpProvider.responseInterceptors.push(interceptor);

原因

angular-ui-router は $http サービスを依存関係として $TemplateFactory への循環参照を作成します。 $http の中に $httpProvider の中で、インターセプターをディスパッチします。

を注入しようとすると、同じ循環依存性例外が発生します。 $http サービスを直接インターセプターに注入しようとすると、同じ循環依存性例外が発生します。

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

懸念事項の分離

循環依存性の例外は、アプリケーション内で懸念事項が混在していることを示すことがあり、安定性の問題を引き起こす可能性があります。この例外が発生した場合、自分自身を参照することになる依存関係を確実に回避するために、アーキテクチャを調べる時間を取る必要があります。

Stephen Friedrich の回答

私は、以下の回答に同意します。 $injector を使用して目的のサービスへの参照を直接取得することは理想的ではなく、アンチパターンと見なされる可能性があります。

イベントを発行することは、よりエレガントで、かつ非連続なソリューションです。