[解決済み] AngularJS: HTTPインターセプターへのサービスインジェクション (円形依存)

質問

AngularJSアプリで認証処理をするためにHTTPインターセプターを書こうとしています。

このコードは動作しますが、私はAngularがこれを自動的に処理することになっていると思ったので、手動でサービスを注入することに懸念しています。

    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;
            }
        };
    })
}]);

最初はやっていたことですが、循環依存性の問題にぶつかりました。

    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');
});

もうひとつ気になるのが セクションが $http のセクションでは、Http インターセプターに "通常の方法" で依存性を注入する方法を示しているように見えるからです。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');

上記のコードはどこに書くべきでしょうか？

私の質問は、これを行うための正しい方法は何ですかということだと思います。

ありがとうございます。私の質問が十分に明確であったことを願っています。

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

http と AuthService の間に循環的な依存関係があります。

を使うことで行っていることは $injector サービスを使用することで行っていることは、$http の AuthService への依存を遅らせることで、 鶏と卵の問題を解決しています。

あなたがしたことは、実際には最もシンプルな方法だと思います。

また、こんな方法もあります。

• インターセプターを後で登録する (これは run() ブロックではなく config() ブロックの代わりに ブロックにすることで、すでにトリックを行うことができるかもしれません)。しかし、あなたは $http がすでに呼び出されていないことを保証できますか？
• を呼び出してインターセプターを登録する際に、 AuthService に手動で $http をインジェクトします。 AuthService.setHttp() などで登録します。
• ...