Angular 5 HttpClient错误响应无法捕获

时间:2018-03-27 11:53:12

标签: javascript angular angular-http angular-http-interceptors angular-httpclient

我们正在使用Angular 5和Spring 2 OAuth后端。 现在,当我发送旧令牌时,它当然已过期。它返回状态代码:401和带有无效令牌的错误响应,依此类推。现在我无法在日志中或在发现错误时看到它。我想得到错误,所以我可以先记录它,然后再刷新令牌或将其发送到登录页面。

现在,如果我订阅了以下请求:

.subscribe(res => {
    //just random stuff.
    }, err => {
    console.log("error", err);
});

I just see this response in the log with an unknown error like in this image

可能是后端失败了吗?因为我还在日志中看到类似于" No' Access-Control-Allow-Origin'标题存在" -error,尽管它是由于无效的标记。

Although I can see this response code in Google Chrome Dev Tools 和401状态代码。

所以我试着自己找一个解决方案。我已经有了一个拦截器并尝试了一些解决方案

return next.handle(authReq)
  .catch(error => {
    console.log("im in here");
    console.log(error);
    return Observable.throw(error);
  });

Http服务只会抛出一个错误,即如果没有记录错误或者" im在这里",那么catch就不是一个函数。

我在next.handle之后尝试过.do,我得到了与catch

相同的错误
.do((event: HttpEvent<any>) => {
    if (event instanceof HttpResponse) {
      // do stuff with response if you want
    }
  }, (err: any) => {
  console.log(err);
    if (err instanceof HttpErrorResponse) {
      if (err.status === 401) {
      }
    }
  });

我已经在http.get之后尝试使用管道,但它也没有用。

http.get(...).pipe(
  retry(3), // retry a failed request up to 3 times
  catchError(this.handleError) // then handle the error
);

1 个答案:

答案 0 :(得分:2)

    import 'rxjs/add/operator/catch';

    Somefunc(){
    this.httpClient
          .get("data-url")
          .subscribe(
            data => console.log('success', data),
            error => console.log('oops', error)
          );
    }


    OR

this.httpClient
      .get("data-url")
      .catch((err: HttpErrorResponse) => {
        // simple logging, but you can do a lot more, see below
        console.error('An error occurred:', err.error);
      });

应该工作。