时间戳

首页 > 解决方案 > 如何处理 API 服务中的 HTTP 错误并仅在成功的情况下通过 Observable 返回响应？

angular - 如何处理 API 服务中的 HTTP 错误并仅在成功的情况下通过 Observable 返回响应？

问题描述

在我的 Angular2 应用程序中，我有一个带有sendRequest方法的api.service ，它应该执行以下操作：

  1. 向服务器发送请求
  2. 向调用者返回承诺（我希望调用者只获得成功响应）
  3. 如果发生错误，请在本地处理错误（导航用户登录或显示弹出窗口）

我使用 Promise 实现了它：

sendRequest(method: string, url: string, data: any) : Promise<any> {
    return this.http.request(method, url, {
        body: data,
        headers: {
            'Accept': 'application/json, text/plain, */*',
            'Authorization': 'bearer ' + token,
            'Content-Type': 'application/json;charset=UTF-8'
        }
    }).toPromise().catch((res) => this.handleError(res));
}

handleError(response: any) {
    if (response.status === 401 || response.status === 403) {
        this.tokenService.deleteToken();
        this.router.navigate(['login']);
    }
    // Show popup etc.
    ...
}

我想用 observable 替换 promise：

sendRequest(method: string, url: string, data: any) : Observable<any> {...}

请告知如何做到这一点。谢谢你。

编辑 1：我找到了处理响应的示例，然后将一些结果传递给观察者。那不是我需要的。如果发生错误，则根本不应该通知观察者。仅当成功响应到达时才应通知观察者。如果发生错误，它应该只在api.service中处理。

标签： angularrxjsangular2-servicesrxjs5angular2-observables

解决方案

请看下面 -

sendRequest(method: string, url: string, data: any) : Observable<any>{
    return this.http.request(method, url, {
        body: data,
        headers: {
            'Accept': 'application/json, text/plain, */*',
            'Authorization': 'bearer ' + token,
            'Content-Type': 'application/json;charset=UTF-8'
        }
    }).map( ( res ) => {
      return res || {};
    } )
    .catch( this.handleError );
}



handleError(response: any) {
    if (response.status === 401 || response.status === 403) {
        this.tokenService.deleteToken();
        this.router.navigate(['login']);
    }
    // Show popup etc.
    ...
}

推荐阅读