有没有办法，我可以在 Angular HTTP 拦截器中阻止 HTTP 请求，直到其他请求成功？答案

【问题标题】：Is there a way, I can block HTTP request inside the angular HTTP interceptor until some other request success?有没有办法，我可以在 Angular HTTP 拦截器中阻止 HTTP 请求，直到其他请求成功？
【发布时间】：2023-03-30 05:30:02
【问题描述】：

我有 Angular 应用程序，其中 API 调用（R2、R3..）应该使用某些标头调用。但是此标头的数据是从另一个服务调用 (R1) 中获取的。所以我们必须阻止其他请求，直到 R1 完成。

【问题讨论】：

利用async和await功能

标签： angular typescript

【解决方案1】：

在这种情况下可以使用 RxJs Observer。当响应来自 R1 时，应调用 R2 和 R3。因此，请在某处订阅观察者，如果标头出现，则在响应时调用 R2 和 R3。从 R1 响应调用observer.next。

【讨论】：

其他 R2 和 R3 调用不同的组件。所以我们不能用这个。
R2 和 R3 只会在观察者订阅的地方被调用，并且只在它需要的地方订阅。不要到处订阅。
您也可以使用observer.next(message) 传递消息来确定需要调用哪个R2 和R3。

【解决方案2】：

我会这样做：

将 R1 作为 BehaviourSubject 的可观察对象
所有需要这些标头的调用 R2、R3...RX 订阅 R1 并等待完成，然后恢复

R1 必须执行一次并将 next 多播给它的所有观察者（R2、R3、...），并且 BehaviourSubject 将最后一个 next() 重播给需要通知的每个订阅者

如果您的所有请求都符合此要求（所有 R 请求都依赖于这些标头），那么（当然）将 HttpInterceptor 与 BehaviourSubject 结合使用会更实际。您还可以考虑使用您将要创建的请求扩展 httpClient 和管道 R1。一切都取决于您的项目要求

希望对你有帮助

【讨论】：