web-dev-qa-db-ja.com

HttpInterceptorのcatchErrorから監視可能なキャッチされたエラーを返すとエラーループが発生する

リクエストを処理し、RXJS catchErrorを使用してhttpエラーをキャッチするシンプルなインターセプターがあります。 catchErrorで受け取った2番目の引数は、catchオブザーバブルです。場合によっては、このエラーを返して、サブスクライブ関数のエラーハンドラーまで伝播させたいと思います。問題は、キャッチされたエラーを返すと無限ループが発生することです（例に示すように https://stackblitz.com/edit/angular-u4gakr ）。

404などのHTTPエラーを受信すると、catchErrorがループでスタックするインターセプターのインターセプト関数：

return next.handle(request)
  .pipe(
    catchError((error, caught$) => {
      console.log('Returning caught observable'); 
      return caught$;
    })
  );

おそらく、インターセプターまたはRxJS catchErrorについて何かを誤解していると思います。なにか提案を？

angularrxjsrxjs6
7
Jan Greger Hemb

キャッチされたオブザーバブルを返すためにreturn throwError(error)を使用する必要があることがわかりました。

最終的なコードは次のとおりです。

return next.handle(request)
  .pipe(
    catchError((error) => {
      console.log('Returning caught observable'); 
      return throwError(error);
    })
  );
2
Jan Greger Hemb

リターンをちょう​​どこれに変更することができ、サブスクライブはエラーを処理します。

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<any> {
    const requestCopy = request.clone();
    return next.handle(request).pipe(catchError(error => {
      if (error.status === 404) {
        return throwError(error)
      } else {
        return of()
      }
    }))
  }

https://stackblitz.com/edit/angular-zz3glp

1
canpan14