7

これは、各リクエストに認証トークンを添付するインターセプターをどのようにセットアップしたかの実例です (これは多かれ少なかれhttps://docs.angularjs.org/api/ng/service/ $http の例です) 。

angular.module("app", [])
.config(function ($httpProvider) {
  $httpProvider.interceptors.push("authInterceptor");
})
.factory("authInterceptor", function ($q) {
  return {
  // interceptor configuration here
  }
})

configandブロックには、さまざまな角度モジュールからサービスを呼び出して開始する他のものがたくさんあるrunので、少し整理したいと思います。ただし、ブロックでの依存性注入には非常に具体的なルールがいくつかあることを理解していconfigますが、これはよくわかりません。これらはauthInterceptor、別のモジュールでファクトリを定義することを妨げています。configandブロック内の他のロジックがrunアプリ内の他のモジュールを呼び出すため、そのインターセプターを宣言するのは場違いに見えます。

これは私がやりたいことです：

angular.module("services.authInterceptor", [])
.factory("authInterceptor", function ($q) {
  return {
  // interceptor configuration here
  }
});

angular.module("app", [
 "services.authInterceptor"
]).config(function ($httpProvider, authInterceptor) {
  $httpProvider.interceptors.push("authInterceptor");
});

// Error: Unknown provider authInterceptor.

代わりにブロックに注入しようとしましたが、そこrunに注入することは許可されていないと思います$httpProvider:

angular.module("app", [
  "services.authInterceptor"
]).run(function ($httpProvider, authInterceptor) {
  $httpProvider.interceptors.push("authInterceptor");
});

// Error: Unknown provider: $httpProviderProvider <- $httpProvider

モジュールをどこに注入して、それ$httpProviderも注入可能にする必要がありますか? また、インターセプターを既存のものにどこに追加する必要がありますか? 私の主な目標は、インターセプターやその他の同様のサービスを、独自の自己完結型モジュールに保持することです。

編集

provider代わりにa を宣言すると、近づいているように見える別のエラーが発生しますfactory（何らかの理由で、これらは交換可能であると常に考えていました）：

angular.module("services.authInterceptor")
.provider("authInterceptor", function ($q) {
  return {}
})

// Error: Unknown provider: $q

authInterceptorそのため、ブロックに正常に注入されるようになりましconfigたが、検索しようとすると失敗します$q。

4

1 に答える 1

10

構成フェーズでは、プロバイダーと定数のみを注入できます。これは、完全に設定される前にサービスがインスタンス化されるのを防ぐためです。

これが、インターセプターを名前で登録する理由です (名前を文字列として$httpProvider.interceptors配列にプッシュします)。これらは後で実行時に解決されます。

これは、実際の例で行ったことと、インターセプターが別のモジュールにある場合でも、2 番目に行う必要があることです。

angular.module("services.authInterceptor", [])
.factory("authInterceptor", function ($q) {
  return {
  // interceptor configuration here
  }
});

angular.module("app", ["services.authInterceptor"])
.config(function ($httpProvider) {
  $httpProvider.interceptors.push('authInterceptor');
});

デモ: http://plnkr.co/edit/A8SgJ87GOBk6mpXsoFuZ?p=preview

于 2014-05-07T21:16:39.797 に答える