Асинхронный вызов HttpClient get

Question

Следующий код используется для асинхронного получения файла. Этот метод принадлежит сервису. Он вызывается из конструктора класса AppComponent.

public async ReadConfiguration () 
  {
      await this.http.get ('http://localhost:80/api/Target.xml',{ responseType: 'text' }).subscribe(
      (val) => {
          console.log("GET call successful value returned in body", val);
                      
      },
      response => {
          console.log("GET call in error", response);
      },
      () => {
          console.log("The GET observable is now completed.");
      }); 

    /*await this.http.get('http://localhost:80/api/Target.xml',{ responseType: 'text' }).toPromise()
    .then((data: any) => {
     
      console.time('request-length');
      console.log(data);
      console.timeEnd('request-length');

    });*/
  }

Сразу после вызова «ReadConfiguration» я позвонил:

console.log ('Completed');

Но в соответствии с консолью HttpClient.get завершается после «Completed»,Подскажите, пожалуйста, что не так в моем коде?

Заранее спасибо, Звика

Answer 1

await следует использовать для ожидания Promise. Но когда вы вызываете .subscribe(), он возвращает объект Subscription.

Если значение выражения, следующего за оператором ожидания, не является Обещанием, оно преобразуется в разрешенное Обещание.

Это означает, что вы на самом деле не ждете, покаваш запрос GET завершен, поэтому вы видите «Завершено», а затем «Наблюдаемое GET завершено».

Answer 2

Вам понадобится обещание для await. get из HttpClient возвращает Observable, в то время как await ожидает promise.

. Вы можете использовать функцию toPromise() для преобразования Observable в Promise.

Вы также можете использовать Pipes, например tap, catchError и finalize, чтобы не подписываться на Observable внутри службы.

return this.http.get ('http://localhost:80/api/Target.xml',{ responseType: 'text' })
  .pipe(
    tap(val => console.log("GET call successful value returned in body", val)),
    catchError(error => console.log("GET call in error", error)),
    finalize(() => console.log("The GET observable is now completed."))
  )
); 

Для прокомментированной части, даже если вы используете toPromise(), она все равно не будет работать, как если бы вы поставили запись сразу после вызова.

Асинхронные функции возвращают обещание, которое вы должны подождать, а затем записать значение. Вы либо используете then как ReadConfiguration().then(() => console.log("Completed")), либо используете async/await.