如何批量请求api？

Question

I have lots of items to post to server. I've done this in one call since server accepts any number of items but it actually doesn't suit my situation well as I have timeout on clientside and number of items can grow without any limit. so it might be saved on server, I don't get the response back and next time I call the api, number of items accumulate..

So I'd like to handle this as a batch.

Client sends 10 items, wait for the server response. Once response is back, process it on client side then send another 10 items to server and so on.

How would I be achieve this? PromiseAll ( or combineLatest?)would fire request in parallel but what I want is sequential as I understand.

This is my test method and not working as I'd like to return observable when it's all done.

private test(data):Observable<any>{

    const saveFormInstanceURL = this._networkService.serverUrl + this.SAVE_FORM_INSTANCE_SUFFIX;

    let i = 0;

    return from([data,data,data,data,data]).pipe(
      concatMap(postBody => {
        i++;
        return this._networkService.post(saveFormInstanceURL,postBody)
      })
    ).subscribe(val => {
      console.log('concatMap:', val);
      if (i === 4){
          console.log('all finished');
          return of([]);
        }
    });
  }

Answer 1

You can do it with RxJs, the code snippet below is for processing one by one however, you can set the interval depending on your needs.

interval(100) 
    .pipe(
      take(this.yourArray.length),
      map(i => this.yourArray[i])
    )
    .subscribe(item => {
      console.log(item); // do your thing
    });

This if for 10 by 10 processing with 1 seconds of interval (100 ms for each):

interval(100)
.pipe(
  take(this.yourArray.length),
  bufferCount(10)
)
.subscribe(itemArray=> {
  console.log(itemArray);
});