Angular HttpClient:即使发生错误,如何获取原始HTTP响应

时间:2019-10-02 22:13:39

标签: angular httpclient http-error

在使用HttpClient的Angular服务中,我创建了一个从POST返回原始HTTP响应的方法:

httpOptions = {
  headers: new HttpHeaders({
    'Content-Type': 'application/json'
    //observe: 'response'
  }),
  observe: 'response' as 'body'
};

forgotLogin(requestData: PUMRequestData): Observable<HttpResponse<string>> {
  return this.http.post<HttpResponse<string>>("http://...", requestData, this.httpOptions);

然后在我的组件中,我只看原始http响应中的状态和正文。

this.api.forgotLogin(pumRequestData).subscribe(response => {
  this.hStatus = response.status;
  this.hBody = response.body;
});

问题在于,如果响应状态不在200系列中,则HttpClient会引发错误。在我的用例中,我只想获取请求状态和主体,而无论状态是什么,我都想根据组件中的状态而不是服务中的错误处理程序中的状态来决定要采取什么操作。我一直在尝试找到一种在服务中创建错误处理程序的棘手方法,该方法仅返回(Observable)HTTP响应,但未能做到-甚至不确定这是否是正确的方法。 / p>

那么当状态不是200系列时,如何将原始的HTTP响应返回给我的组件?

3 个答案:

答案 0 :(得分:1)

这对我来说HttpClient not able to retrieve plain text有用。

That's right.
It works when there is no generic code applied to it.
it will work for:

http.get(url, {responseType: 'text'}

答案 1 :(得分:0)

订阅HTTP响应时,可以添加错误处理程序。 HttpErrorResponse对象包括HttpResponseBase继承的HttpHeadersstatusstatusText

body在属性HttpErrorResponse.error中可用。

HttpResponseBase属性在HttpErrorResponse上可用

  
      
  • 标头:HttpHeaders-所有响应标头。
  •   
  • 状态:数字-响应状态代码。
  •   
  • statusText :字符串-响应状态代码的文字描述。 (不要依赖)
  •   
  • URL :字符串| null-检索到的资源的URL,或者null(如果不可用)。
  •   
  • 确定:布尔值-状态代码是否在2xx范围内。
  •   

示例

this.api.forgotLogin(pumRequestData).subscribe(
  response => {
    this.hStatus = response.status;
    this.hBody = response.body;
  },
  (error: HttpErrorResponse) => {
    if (error.error instanceof ErrorEvent) {
      // A client-side or network error occurred. Handle it accordingly.
      console.error('An error occurred:', error.error.message);
    } else {
      // The backend returned an unsuccessful response code.
      // The response body may contain clues as to what went wrong,
      console.error(`Backend returned code ${error.status}, ` +
        `body was: ${error.error}`);
    }
  }
);

错误处理程序也可以放置在RXJS pipe中,以便可以在订阅HTTP请求之前将其嵌入。

this.http.get<Object>(full_url, options).pipe(catchError((error: HttpErrorResponse) => {
  // Process error here, such as logging.
  ...
  return throwError(error)
}))

请参阅Angular HttpClient文档:Error handling

答案 2 :(得分:0)

好吧,我屈服并通过使用建议的错误处理程序来解决(感谢Christopher)。我想要的是一个http客户端,无论状态如何,它都只会将我传递回http响应,并且仅在没有返回响应的情况下抛出错误(例如,不存在的域)。 Angular HttpClient不会这样做。可能还有另外一个http客户端库,但是寿命太短了。

我只需要响应中的HTTP状态和正文,所以我创建了以下错误处理程序:

  private handleError(error: HttpErrorResponse) {
    if (error.status == 0)
      return of({ status: 600, body: "Unexpected error. If this problem persists, please contact ..." })
    else
      return of({ status: error.status, body: error.error });
  }

然后我的API调用方法如下:

  changePassword(requestData: PUMRequestData): Observable<HttpResponse<string>> {
    return this.http.put<any>("http:// ... /API/ChangePassword", requestData, this.httpOptions)
      .pipe(catchError(err => this.handleError(err)));
  }

现在,无论订户是从成功的HTTP Status 200调用还是从错误处理程序获得响应,它都将包含“状态”和“正文”。请注意,如果没有HTTP响应,那么我将设置一个虚拟的HTTP Status 600,在这种情况下,我必须提供正文中缺少的错误消息。另外,我还不得不将put的数据类型从HttpResponse字符串更改为any。