Question

所以我创建了一个刷新令牌http inteceptor，它从API查找401错误，然后尝试刷新用户令牌。

这里有很多教程，还有很多关于如何处理令牌刷新的教程，但是，很多，如果不是全部，它们都只是在Inteceptor中使用服务，而我想使用NGRX调度动作。

我的操作（见下文）很简单，REFRESH_TOKEN触发一个效果，该效果调用API端点，该API端点有望为用户返回一个新的令牌（我还有其他效果可以处理该操作的成功/失败，相应地重定向或保存数据）。

我第一次尝试使用感受器：

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        this.loaded$ = this.auth.pipe(select(selectAuthLoaded));
        this.loading$ = this.auth.pipe(select(selectAuthLoading));

        // @ts-ignore
        return next.handle(request).pipe(catchError(error => {
            if (error instanceof HttpErrorResponse && error.status === 401) {
                return this.handle401Error(request, next);
            } else {
                return throwError(error);
            }
        }));
    }

    private handle401Error(request: HttpRequest<any>, next: HttpHandler) {
        this.loading$.subscribe(isLoading => {
            this.storage.getItem('refresh_token').subscribe(refreshToken => {
                if (!isLoading && refreshToken) {
                    this.auth.dispatch(new RefreshToken(refreshToken));
                } else {
                    return next.handle(request);
                }
            });
        });
    }

}

我在这里的想法是，如果它是401，请运行handle401ERror函数。这首先检查是否已加载身份验证状态，并让用户从本地存储刷新令牌（这很糟糕，一旦我将其钉牢，它将被更改为COOKIE），如果已加载身份验证且有刷新令牌，则进行分配REFRESH_TOKEN操作。

这似乎导致以下错误：

You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.

Answer 1

我也遇到了这个问题。在找到更好的解决方案之前，我只是了解了效果本身。我不确定这是否可以作为答案，但这是我到目前为止使用的代码：

if (error.msg === 'invalid_token') {
  this.authService.dispatch(fromAuthStore.refreshToken());
  return this.authEffects.refreshTokenSuccess$.pipe(
    take(1),
    mergeMap(() => {
      return next.handle(this.setRequest(req));
    })
  );
} else {
  return throwError(error);
}

希望这会有所帮助

edit：这是一个链接，可能会给出更多解释并提供替代方法。基本上，您最终会听ngrx。 https://netbasal.com/listening-for-actions-in-ngrx-store-a699206d2210

使用NGRX刷新令牌接收器

1 个答案: