"如何按順序發送獨立的http請求"

Question

我想依次發送10個獨立的請求。 並希望在一個數組中獲得所有結果。 我試過forkJoin<\/code>但它同時滿足了所有請求。

對於並行請求

search(queryUrls) {
    queryUrls.forEach((query) => {
        observableBatch.push(this.http.post(query.url, query.data))
            .pipe(
                map((res) => res),
                catchError(e => of('Error'))
            );
    });

    //
    return forkJoin(observableBatch);
}

Answer 1

你需要使用concat 。

concat將訂閱第一個輸入Observable並發出其所有值，而不以任何方式更改或影響它們。 當Observable完成時，它將訂閱然后傳遞下一個Observable，並再次發出其值。 這將重復，直到操作員用盡Observables。 當最后一個輸入Observable完成時，concat也將完成。

如果您希望將所有這些結果收集到一個數組中，則需要使用toArray運算符來折疊結果。

在你的情況下，它看起來像：

const batched = queryUrls.map(query => this.http.post(query.url, query.data))
concat(batched).pipe(toArray()).subscribe(allResults => /**/)

Answer 2

解決方案（concatMap保持請求的順序）

   const results = [];
   search(queryUrls) {
       from(queryUrls).pipe(
         concatMap((query) => this.http.post(query.url, query.data)),
         catchError(e => of('Error'))
       ).subscribe((response) => results.push(response.body));
    }

說明： mergeMap、switchMap、concatMap的區別

如果你想在所有請求完成后將結果發送到另一個 observable 中，你可以這樣做

output$ = new Subject();
   search(queryUrls) {
       const results = [];
       from(queryUrls).pipe(
         concatMap((query) => this.http.post(query.url, query.data)),
         catchError(e => of('Error'))
       ).subscribe(
         (response) => results.push(response.body),
         () => {},
         () => { output$.next(results); } // this is executed on complete
       );
    }