Выполнить http-запрос последовательно в Angular 6

Question

Мне нужно отправить несколько запросов HTTP PUT на сервер последовательно (после того, как следующий запрос запущен только после завершения предыдущего запроса, номер запроса не фиксирован).Если я использую приведенный ниже исходный код, все запросы будут отправлены

 `listURL.forEach(url => {
    const req = new HttpRequest('PUT', url, formData, { reportProgress: true});
    httpClient.request(req).subscribe(event=>{});
  });`

Есть ли возможность последовательно выполнять запросы?

Answer 1

использование reduce и switchMap:

['url 1', 'url 2'].reduce((acc, curr) => acc.pipe(
  mergeMap(_ => this.mockHttpCall(curr)),
  tap(value => console.log(value)),
), of(undefined)).subscribe(_ => console.log('done !'));

Stackblitz

Answer 2

Если вы не знакомы с rxjs, возможно, вы можете попробовать следующее?

let requests = listURL.map(url => new HttpRequest('PUT', url, formData, { reportProgress: true});

function do_seq(i) {
  httpClient.request(requests[i]).subscribe(event => {
   if (i < requests.length - 1) do_seq(i + 1);
  });
 }

do_seq(0);

Answer 3

Вы можете использовать async / await с Promise для потоковой передачи этого.Преобразуйте наблюдаемое в обещание, используя toPromise()

async doSomethingAsync() {
    for(let url of listURL) {
        const req = new HttpRequest('PUT', url, formData, { reportProgress: true});
        const result = await httpClient.request<ModelHere>(req).toPromise();
        // do something with result
    }
}

Подробнее об асинхронности / ожидании см. Также этот превосходный ответ и перейдите к заголовку ES2017 +: Обещания с асинхронностью / ожиданием .