路由守卫中mergeMap返回Observable的错误捕获问题

咱们一步步拆解你的问题，理清Observable的层级关系，找到错误捕获的核心问题，再给出针对性的修复方案。

1. 当前的内外Observable分别是哪个？ #

• 外层Observable：就是this.securityService.getUserRegions(this.authService.userName)返回的流，它是整个canActivate方法返回流的源头，负责触发后续的操作链。
• 内层Observable：是你在mergeMap里返回的this.permissionsService.getReadWritePermissions(...)流——它由外层流的结果触发，属于嵌套在外层流内部的子流。

2. 为什么无法捕获mergeMap返回Observable的错误？ #

你的代码结构里，第一个pipe包含了mergeMap和第一个catchError，第二个pipe接在第一个pipe的输出之后。这里的核心问题是RxJS的错误冒泡机制：

当mergeMap内部的内层流（也就是getReadWritePermissions的请求）抛出错误时，这个错误会向上传递到外层流的错误处理链中，也就是第一个catchError。而第二个pipe的catchError只能捕获第一个pipe处理完成后重新抛出的错误（比如第一个catchError里的throwError(regionsErr)），自然无法单独捕获getReadWritePermissions的错误。

简单说就是：你现在的错误处理链把两个请求的错误都交给了第一个catchError，第二个catchError根本没机会接触到getReadWritePermissions的错误。

3. 解决方案：调整catchError的绑定位置 #

要分别捕获两个请求的错误，你需要把处理getReadWritePermissions错误的catchError放到mergeMap内部，和内层流绑定在一起。这样两个错误就会被各自的处理器捕获，互不干扰。

修改后的代码如下：

canActivate(): Observable<boolean> {
  return this.securityService
    .getUserRegions(this.authService.userName)
    .pipe(
      mergeMap((userRegions: Region[]) => {
        this.regionService.setRegionList(userRegions);
        // 把处理getReadWritePermissions错误的catchError绑定到内层流上
        return this.permissionsService.getReadWritePermissions(
          this.authService.userName,
          userRegions.map(r => r.regionId),
          undefined
        ).pipe(
          catchError((permissionsErr: any) => {
            // 这里专门捕获getReadWritePermissions的错误
            debugger;
            return throwError(permissionsErr);
          })
        );
      }),
      catchError((regionsErr: any) => {
        // 这里专门捕获getUserRegions的错误
        debugger;
        return throwError(regionsErr);
      }),
      map((regionPermissions: RegionPermission[]) => {
        this.regionService.setRegionPermissionList(regionPermissions);
        return regionPermissions.some(rp => rp.readWriteAccess.hasReadAccess || rp.readWriteAccess.hasWriteAccess);
      })
    );
}

调整后逻辑就完全符合你的预期了：

• 如果getUserRegions请求出错，直接触发外层的catchError；
• 如果getUserRegions成功，但getReadWritePermissions出错，触发内层的catchError；
• 最后通过map判断权限，返回是否允许访问的布尔值。

内容的提问来源于stack exchange，提问作者emmep