Angular 2 Http响应通用错误处理程序

哈维尔·恩里克斯(Javier Enriquez)

我正在实现一个Angular 2应用,它将进行一些API调用。我想知道是否总有一个通用的错误处理程序。例如,如果API用401代码响应,我想将用户重定向到登录路由。这可以吗?

谢谢

我创建了一个http帮助器方法,该方法可用于所有服务。至少可以集中整个应用程序中的所有http活动。

虽然有时会处理错误详细信息-请在此处查看我的问题:Angular 2 http服务。获取详细的错误信息

UPD:2016-09-12-固定remove方法。Angular http服务需要定义主体。该方法存在的原因-我希望能够将body作为delete请求的一部分进行传递,而Angular的方法不允许这样做。

import {Injectable} from '@angular/core';
import {Http, Request, Response, Headers, RequestOptionsArgs, RequestMethod} from "@angular/http";
import {RequestArgs} from "@angular/http/src/interfaces";
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

@Injectable()
export class JsonHttpHelper {
    protected headers: Headers;

    constructor(private _http: Http) {
        this.headers = new Headers();
        this.headers.append('Content-Type', 'application/json');
        this.headers.append('Accept', 'application/json');
    }

    get(url:string) : Observable<any> {
        return this._http.get(url)
            .map((res: Response) => res.json())
            .catch(this.handleError);
    }

    post(url:string, data:any, args?: RequestOptionsArgs) : Observable<any> {
        if (args == null) args = {};
        if (args.headers === undefined) args.headers = this.headers;

        return this._http.post(url, JSON.stringify(data), args)
            .map((res: Response) => JsonHttpHelper.json(res))
            .catch(this.handleError);
    }

    put(url:string, data:any, args?: RequestOptionsArgs) : Observable<any> {
        if (args == null) args = {};
        if (args.headers === undefined) args.headers = this.headers;

        return this._http.put(url, JSON.stringify(data), args)
            .map((res: Response) => JsonHttpHelper.json(res))
            .catch(this.handleError);
    }

    remove(url: string, data?: any, args?: RequestOptionsArgs): Observable<any> {
        if (args == null) args = {};

        args.url = url;
        args.method = RequestMethod.Delete;
        if (!args.headers) args.headers = this.headers;
        args.body  = data ? JSON.stringify(data) : null;

        return this._http.request(new Request(<RequestArgs>args))
            .map((res: Response) => JsonHttpHelper.json(res))
            .catch(this.handleError);
    }

    private static json(res: Response): any {
        return res.text() === "" ? res : res.json();
    }

    private handleError(error:any) {
        console.error(error);
        return Observable.throw(error);

        // The following doesn't work.
        // There's no error status at least in case of network errors.
        // WHY?!
        //
        // if ( error === undefined) error = null;
        // let errMsg = (error && error.message)
        //     ? error.message
        //     : (error && error.status)
        //         ? `${error.status} - ${error.statusText}`
        //         : error;
        //
        // return Observable.throw(errMsg);
    }
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Angular 6中的HTTP错误处理

Angular2处理HTTP响应

在angular 2中处理来自http.get的成功和错误响应

集中处理Angular 2 http错误

Yii2:仅对致命错误使用错误处理程序或指定已处理的错误类型

Angular2:HTTP错误处理

HTTP错误处理程序中的Angular 2 router.navigate()

Angular 2错误处理-发送到订阅的组件

Angular 2中的Observables错误处理

Angular 2(TypeScript)处理来自Http的空json响应

Angular2错误处理最佳实践

单实例Angular 2+通知服务/错误处理程序

Angular 2 HTTP获取处理404错误

Angular 2/4 forkjoin URL中的错误处理

Angular中的通用HTTP错误处理

使用Material Design的Angular2应用程序的常规错误处理程序

Angular HTTP指南错误处理-错误?

Angular 2-仅当未捕获到错误时才执行全局错误处理程序

为什么Angular的Tour of Heroes http错误处理程序接受任何类型的参数?

Angular JS将数据传递给$ http一个全局错误处理程序

angular2 –多次处理相同的响应错误

Ionic Angular:创建通用的 http 错误处理程序

如何在 angular2 的不同模块中使用自定义错误处理程序服务

Angular 2 http 服务错误处理

如何在 Angular 6 中实现与 forkJoin 一起使用的通用错误处理?

HTTP 响应错误处理 Angular 应用程序

Angular 6 的错误处理程序服务中的“找不到 http”

Angular 中的 HTTP 错误处理

带有 rxjs 重播主题的 Http 错误处理程序拦截器配置 - Angular