javascript - Angular - 每 30 秒调用一次函数，但要考虑运行该函数所花费的时间

Question

我有一个 Angular 7 应用程序，我正在使用 RxJS。

我想每 30 秒从端点获取一个内容列表，但有时请求可能需要一段时间，我想考虑那个时间。

示例:如果请求需要 10 秒，那么我想在 40 秒 (30 + 10) 后再次调用它，而不是 20 (30 - 10)。

我正在尝试:

fetchList() {

   this.service.fetchListFromHttp()
      .pipe(
        finalize(() =>
          setTimeout(() => {
            this.fetchList();
          }, 30000)
        )
      )
      .subscribe(
         result => this.list = result,
         err => this.logError(err)
      );
}

我可以想象，当 http 请求时，它会在 30 秒后触发另一个对 fetchInfo 的调用，但发生的情况是我得到了奇怪的间隔。例如，函数每 10 秒或 20 秒被调用一次，以及类似的奇怪间隔。
我会假设间隔总是大于 30 秒。

Answer 1

您是否连接到自己的后端？如果您是编写 API 以获取信息表单的人，socket.io可能是你正在寻找的东西来实现这一点。

您是否考虑过使用 RxJS ?它带有 Angular，我相信你可以完成一些获取然后暂停的事情

类似的东西可能会起作用
this.service.fetchInfoFromHttp().pipe(delay(30 * 60 * 10000), () => ...), repeat(Infinity))
这是 RxJS 文档的链接

RxJS delay

RxJS repeat

Socket.io

编辑:
How Can I make a Timer using an observable in Angular 9

再次编辑:

感谢您的评论 @goga-koreli ，也许去抖动会起作用

https://www.learnrxjs.io/learn-rxjs/operators/filtering/debounce