Javascript 将$http拦截器创建为独立模块时出现角度依赖项错误

下面是我如何设置一个拦截器的工作示例，该拦截器将身份验证令牌附加到每个请求（这或多或少是$http中的示例）

我的

config

和

run

块中还有很多其他东西，它们调用并启动来自不同角度模块的服务，所以我想稍微整理一下。但是，我知道在

config

块中有一些非常具体的依赖项注入规则，我不太了解，这些规则阻止我在单独的模块中定义我的

authInterceptor

工厂。由于

config

和

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.

我尝试将其注入

运行

块，但我猜您不允许在那里注入

$httpProvider

：

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

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

---

因此，它现在成功地将

authInterceptor

注入我的

config

块，但在配置阶段尝试查找

$q

时失败，只能注入提供程序和常量。这是为了防止服务在完全配置之前实例化

这就是为什么要按名称注册拦截器（将名称作为字符串推送到

$httpProvider.interceptors

数组中）。稍后将在运行时解决这些问题

这正是您在工作示例中所做的，也是您在第二个示例中需要做的，即使拦截器位于另一个模块中：

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

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

---

演示：

完美！这是配置块中的一般规则吗？如果我想稍后解析服务，我可以通过字符串调用它们？或者它只适用于添加拦截器？不-没有一般规则。只是简单地解释一下为什么它在本例中是这样工作的：）@tasseKATT谢谢你的这篇文章。在一个.min文件中缩小&concat我的app/***.js后，我遇到了完全相同的问题。我试过你的确切步骤，但开始得到Elise得到的错误。我被卡住了。嗯，在没有看到代码的情况下，真的很难判断问题出在哪里。我只是花了几个小时试图将我的拦截器配置为一个提供者，而我一直都在这样做。非常感谢你的知识。

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

// Error: Unknown provider: $q

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

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