首页 新闻 会员 周边 捐助

Angular在有默认Http拦截器的情况下,如何执行自定义的错误处理方案?

0
[已解决问题] 解决于 2019-02-12 14:52

照着网上一个博客做了一个http拦截器

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // 统一加上服务端前缀
    let url = req.url;
    if (!url.startsWith('https://') && !url.startsWith('http://')) {
      url = environment.SERVER_URL + url;
    }
    
    const newReq = req.clone({ url });
    return  next.handle(newReq).pipe(
      mergeMap((event: any) => {
        // 允许统一对请求错误处理
        if (event instanceof HttpResponseBase)
          return this.handleData(event);
        // 若一切都正常,则后续操作
        return of(event);
      }),
      catchError((err: HttpErrorResponse) => this.handleData(err)),
    );
  }

然后在app.module.ts里进行注册。

 { provide: HTTP_INTERCEPTORS, useClass: DefaultInterceptor, multi: true}

 

拦截器可以正常工作

但是我现在想在某个模块下进行自定义的错误处理

this.http.post('http://localhost:5000/api/value',data)
      .subscribe(
        (res: any) => { console.log(res) }, 
        (error: any)=>{ console.log(error); }, 
        ()=>{console.log("complete");}
      );

在服务器返回400错误的时候,这个请求上的错误处理方法就无效,但是我注释掉http拦截器,就是可以用的。

我怎么才能在有默认http拦截器的情况下,还能继续执行自定义的错误处理方案

写代码的相声演员的主页 写代码的相声演员 | 小虾三级 | 园豆:517
提问于:2019-01-09 17:38
< >
分享
最佳答案
0

问题出在管道 pipe 中的 catchError 

catchError会拦截并处理响应中的错误,以至于后续应用程序除了响应正常的请求以外的状态都接受不到,也就无法处理错误。

解决方案:

将管道中的处理方式更换为tap来处理正常和错误响应

return  next.handle(newReq).pipe(
  tag(
     event => {
        // 允许统一对请求错误处理
        if (event instanceof HttpResponseBase)
          return this.handleData(event);
        // 若一切都正常,则后续操作
        return of(event);
      },
      error => this.handleData(error)),
    )
  );
写代码的相声演员 | 小虾三级 |园豆:517 | 2019-02-12 14:52
其他回答(1)
0

为什么我这里不能使用 tap函数

李小壮 | 园豆:202 (菜鸟二级) | 2019-06-28 10:30
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册