从角度服务通过管道传输时,rxjs catchError 不起作用

tha*_*guy 5 rest error-handling rxjs redux angular

使用 redux 和 Angular,我有以下效果:

  @Effect()
  public authenticate: Observable<Action> = this.actions
    .ofType(AUTHENTICATE)
    .pipe(
      map((action: AuthenticateAction) => action.payload),
      switchMap(payload => {
        return this.userService.authenticateUser(payload.email, payload.password).pipe(
          map(auth => new AuthenticationSuccessAction({ auth: auth })),
          catchError(error => of(new HttpErrorAction({ error: error })))
        );
      })
    );
Run Code Online (Sandbox Code Playgroud)

服务:

  public authenticateUser(email: string, password: string): Observable<IAuthentication> {
    const formData: FormData = new FormData();
    formData.append('email', email);
    formData.append('password', password);
    return this.httpClient.post('/api/auths/useraccounts', formData) as Observable<IAuthentication>;
  }
Run Code Online (Sandbox Code Playgroud)

当 POST 失败时,HttpErrorAction 永远不会被调度。

tha*_*guy 10

结果我忘记了我有一个 HttpInterceptor ,我捕获了这样的 http 错误:

return next.handle(authReq).pipe(catchError(
      (error) => {
        return of(error);
      }
Run Code Online (Sandbox Code Playgroud)

如果我想将错误冒泡到效果,我会执行以下操作:

return Observable.throw(error);
Run Code Online (Sandbox Code Playgroud)

使用较新版本的 rxjs 进行更新:

return throwError(error);
Run Code Online (Sandbox Code Playgroud)