Angular HTTP Interceptor接连发出请求

Question

问题：我正在使用的Angular应用在构造方面非常复杂。在某些情况下，同一组件的许多实例在同一位置（父组件）有不同的数据输入，每个组件都会在应用程序中显示不同图表，例如：

<sample-component [data]='data1> </sample-component> 
 <sample-component [data]='data2> </sample-component>
<sample-component [data]='data3> </sample-component>
... so on

，因此在每种情况下此数据的处理方式都不同并基于每个组件都对相同的API端点进行相同的调用。因此，[[问题是该调用从多个组件实例突然执行了多次，这导致应用程序性能或服务器请求过多。示例解决方案：我在考虑Angular HTTP拦截器，以及如何使用此工具捕获每个请求并在解决前一个请求时执行该请求，因此它们将一一触发。到目前为止，我已经实现了Interceptor，并且能够从Observable访问每个HTTP事件或请求，但是从这一点开始，我不知道如何或是否可以继续“延迟”它们。 （我仍在学习RxJ和Angular相关的东西）我也不确定这是合法的解决方案还是其他实践-可能更好的解决方案是构建更优化的应用程序。还听说过诸如缓存HTTP请求之类的机制。如果不能在“全局”级别上正确处理这些请求，我想必须进入应用程序以重建其结构。有什么建议或提示如何处理这种事情？在此先感谢

Answer 1

您可以使用像

shareReplay这样的运算符来缓存您的http调用，以返回返回的值将始终是最后发出的值，并使延迟的订户可以访问它而无需再次执行该调用：

...
.pipe(
  shareReplay({ bufferSize: 1, refCount: true })
 )

Answer 2

您可以创建一个dataService来包装您的http调用并在那里处理缓存。结合使用BehaviorSubject和httpClient