使用全局错误处理程序处理NGXS（角）中的错误

Question

我想以两种方式处理NGXS中的错误。第一种方法是处理组件中商店调度上的错误。第二种方法是全局角度错误处理程序，作为未处理错误（不是通过第一种方法处理）时的后备。

但是问题是，当操作处理程序中发生错误时，NGRX始终会调用全局错误处理程序。

因此在组件中给出以下代码：

this.store.dispatch(new FetchAction())
   .subscribe( error: () => console.log('fetch error occured'))

此动作处理程序：

fetch() {
   return this.http.get('..');
}

和此全局错误处理程序：

export class GlobalErrorHandler extends ErrorHandler {
   handleError(err: any) {
      console.log('unexpected error occured');
   }
}

控制台中将出现两个错误消息。一个来自调度的订阅，另一个来自全局错误处理程序，因为操作处理程序中存在错误。

现在我可以在操作处理程序中捕获错误，但这将是一个错误的地方，因为操作处理程序不应该知道此操作的错误是在组件中处理的。

我进行了一次堆叠闪电攻击，单击按钮https://stackblitz.com/edit/ngxs-error-throw-r42fkb?file=src/app/app.component.ts

时在控制台中显示两个错误：

Answer 1

使用RxJS catchError运算符来处理低级错误：

这样，您捕获了错误，因此它不会调用全局操作处理程序。

this.store.dispatch(new FetchAction())
   .pipe(catchError(error => /* Do something specific with the error. */))
   .subscribe(() => { /* Do something with the success result. */ })

让错误提示上升到全局操作处理程序：

这里没什么特别的。只需忽略该错误即可。 当您不知道如何处理错误时，请执行此操作。

this.store.dispatch(new FetchAction())
   .subscribe(() => { /* Do something with the success result. */ })

如果要使用throwError，可以重新引发更具体的错误，以便在更高级别处理该错误时有更多信息。

this.store.dispatch(new FetchAction())
   .pipe(catchError(error => throwError(new Error('Some specific error.'))))
   .subscribe(() => { /* Do something with the success result. */ })

Answer 2

我有同样的问题。但是正如文档所述，这是设计使然。即使您在上层进行处理，错误也会传播到主ErrorHandler。

如果未处理的异常引发到动作中，则错误将传播到ErrorHandler，并且您还可以通过订阅Observable来捕获该错误。如果您订阅了Observable调度，则错误将被捕获两次，一次是在ErrorHandler中，另一次是在您的调度句柄上