Question

我想在服务中为API调用添加错误页面重定向，以应对400错误的请求：我的代码如下：

service.ts：

    getIncidents(customerId): Observable<any> {
       return this.http.get<any>(this.incidentApiUrl + "?customer_id=" + customerId)
          .pipe(
            catchError(this.handleError)
          );
      }

   private handleError(error: HttpErrorResponse) {
    if (error.error instanceof ErrorEvent) {
      console.log(error.error.message)

    } else {
      console.log(error.status)
    }
    return throwError(
      console.log('Something is wrong!'));
  };

}

我可以在哪里放置重定向？

Answer 1

您应该创建一个全局错误处理程序。我用这种方式实现。

import { ErrorHandler, Injectable, Injector } from '@angular/core';

@Injectable()
export class GlobalErrorHandler implements ErrorHandler {
    constructor(private logService: LoggerService, private router : Router) {

    }
    handleError(error) {

    if(error.status == 404){
      this.router.navigate(['/error-page']);
    }
  }
}

并添加到NgModule

中的提供者

  provide: LocationStrategy, useClass: HashLocationStrategy},
   {
        provide: ErrorHandler, 
        useClass: GlobalErrorHandler
   }

Answer 2

我现在没有示例，但是您可以。

首先通过组件的构造函数注入路由器，例如：

constructor(private router: Router){...}

然后，在您的handle error函数中执行以下操作：

private handleError(error: HttpErrorResponse) {
    if (error.error instanceof ErrorEvent) {
      console.log(error.error.message)
    } else {
       if (error.status === 400) {
           this.router.navigate(['my','bad_request','page']);
       } else {
           // ....
       }
    }
    return throwError(
      console.log('Something is wrong!'));
  };

Answer 3

您可以在错误处理方法中绝对使用Router服务来将用户重定向到错误组件页面。

不要忘记将Router服务注入构造器中

constructor(private _router: Router) { }

并以错误方法处理它

HandleError() {
    _router.navigate('[error]',{ 'errorCode' :this.errorCode }); 
    //Pass optional parameter to share the error code and handle it in that page
}

如何在Angular的http服务中添加错误页面重定向

3 个答案: