Angular 10 通过 Await 获得 Web 服务状态？答案

【问题标题】：Angular 10 get webservice status with Await?Angular 10 通过 Await 获得 Web 服务状态？
【发布时间】：2020-09-30 11:56:03
【问题描述】：

就在用户登录之前，我需要测试 WebServce 是否响应以及系统是否处于维护状态。在 WebService 部分（core3 .net）我有 2 个功能：

返回的心跳：return Ok("OK");
返回的维护信息返回 OK("No"); 我实时显示 2 次测试的结果，如果没有问题，我会显示登录面板。我需要按顺序进行这些测试，我想用 await 运算符来做。我有一个带有 2 个返回 bool 的函数的 TestHelperServie 类。但我找不到如何从 HTTP 订阅函数传递到 bool 结果。如果我得到 OK 响应，则为 true，如果我得到超时或另一个失败的 HTTP，则为 false。现在我这样做：

async TestHeartBeat()
{
      let Response:Boolean = false;

      const headers = new HttpHeaders()
            .set('Content-Type','application/json');
      
      const options = {
        headers: headers,
        observe: "response" as const,
        responseType: "json" as const
      };

      await this.http.get(`${environment.apiUrl}/TestController/HeartBeat`, options)
      .subscribe(res=>{
        Response = true;
      },
      error=>{
        Response = false;
      })
      return Respone;
}

但该函数不等待 http 响应。我怎样才能解决这个问题？很抱歉我的新手问题，但我来自 c# 世界，我们经常使用 await/async。我不认为我可以在 angular 10 中以同样的方式做到这一点。

【问题讨论】：

标签： angular10

【解决方案1】：

您不能在 Observables 上等待，您必须使用 toPromise() 将其转换为承诺

return await this.http.get(....).toPromise().then(res=> Response = true).catch(err => Response = false);

【讨论】：

【解决方案2】：

使用 rxjs 管道、映射和 catchError。

async TestHeartBeat()
{
      const headers = new HttpHeaders()
            .set('Content-Type','application/json');
      
      const options = {
        headers: headers,
        observe: "response" as const,
        responseType: "json" as const
      };

      return await this.http.get(`${environment.apiUrl}/TestController/HeartBeat`, options)
        .pipe(
           map(res => true),
           catchError(error => false)
        ).toPromise();
}

现在你可以这样称呼它：

if (await TestHeartBeat()) {
   // Display your panel
} else {
   // Service is in maintenance
}

【讨论】：