web-dev-qa-db-ja.com

Angular httpClientインターセプターのエラー処理

httpクライアントのエラー処理についてangularのドキュメントを読んだ後、以下のコードでサーバーから401エラーをキャッチできない理由がまだわかりません。

export class interceptor implements HttpInterceptor {
    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        console.log('this log is printed on the console!');

        return next.handle(request).do(() => (err: any) => {
            console.log('this log isn't');
            if (err instanceof HttpErrorResponse) {
                if (err.status === 401) {
                    console.log('nor this one!');
                }
            }
        });
    }
}

コンソールログで、私もこれを取得します:

zone.js:2969 GET http:// localhost:8080/test 401()

core.js:1449 ERROR HttpErrorResponse {headers:HttpHeaders、status:401、statusText: "OK"、url: " http:// localhost:8080/test "、ok:false、…}

6
sarahwc5

catchErrorを使用してエラーをキャッチする必要があります

return next.handle(request)
      .pipe(catchError(err => {
        if (err instanceof HttpErrorResponse) {
            if (err.status === 401) {
                console.log('this should print your error!', err.error);
            }
        }
}));
5
Amit Chigadani

引数値をストリームのdo関数に渡す必要があります。その中に新しい関数を作成する必要はありません。

return next.handle(request)
    .do((err: any) => {
        console.log('this log isn't');
        if (err instanceof HttpErrorResponse) {
            if (err.status === 401) {
                console.log('nor this one!');
            }
        }
    });
1
Daniel Caldera

エラーハンドラはnew Observable<HttpEvent<any>>()を返す必要があります

return next.handle(request)
    .pipe(catchError((err: any) => {
        console.log('this log isn't');
        if (err instanceof HttpErrorResponse) {
            if (err.status === 401) {
                console.log('Unauthorized');
            }
        }

      return new Observable<HttpEvent<any>>();
    }));
1
Tito Leiva

一番上ではありませんが、Angularはインターセプターよりもエラーを処理する機会があります。独自のErrorHandlerを実装できます。 https://angular.io/api/core/ErrorHandler =

0
Oleksii