Angular Http 缓存和竞争条件

Question

我正在尝试弄清楚如何以最简单的方式最好地解决我的应用程序中的竞争条件。

我有一个包含两个解析器的路由。解析器是:

GetBooksResolver

GetAuthorsResolver

现在，Authors 和 Books 都有一个类型 Genre 需要合并。

因此在两个解析器中，您都有一个 forkJoin:

// GetBooksResolver:
forkJoin(this.http.get('api/genres'), this.http.get('api/books'))
    .pipe(map(data => //merge datasets));

//GetAuthorsResolver
forkJoin(this.http.get('api/genres'), this.http.get('api/authors'))
    .pipe(map(data => //merge datasets));

我有一个简单的 HTTP 缓存服务，可以正确地阻止 HTTP 请求再次触发，但初始竞争条件仍然存在。

因此，您会看到两个不同的 api/genre 调用

有什么方法可以设置缓存拦截器来避免这种情况发生？

Answer 1

正如评论中已经建议的那样，您可以创建一个方法来调用服务返回重播 Observable，如下所示:

public getGenres(): Observable<Genre> {
  return this.httpClient.get('api/genres').pipe(
    shareReplay(1)
  );
}

然后调用此方法获取重播 Observable 并在两个 forkJoin 方法中使用它:

const genres$ = this.getGenres();
// GetBooksResolver:
forkJoin(genres$, this.http.get('api/books'))
    .pipe(map(data => //merge datasets));

//GetAuthorsResolver
forkJoin(genres$, this.http.get('api/authors'))
    .pipe(map(data => //merge datasets));

我还创建了一个工作 StackBlitz示例，以便您可以看到它的实际效果。