angular - 刷新 token 时，AuthGuard 服务 canActivate 不导航

Question

我在使用 AuthGuard 时遇到了一个奇怪的问题。

当我单击链接时，它会检查用户是否具有有效的访问 token 。如果没有，它将查找刷新 token ，然后尝试使用它来获取访问 token (this.oAuthService.refreshToken())。

如果需要刷新，它似乎无法导航。 token 已刷新，但页面无法导航。在 token 刷新发生后，我可以在第二次单击 protected 页面的链接后成功导航。

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean>
{
    this.authUserService.lastUrl = state.url;

    if (this.oAuthService.hasValidAccessToken()) {
      this.authUserService.requireLoginSubject.next(false);
      return Observable.of(true);
    } else {

      if (sessionStorage.getItem('refresh_token') === null) {
        this.router.navigateByUrl('/sessiontimeout');
        this.authUserService.requireLoginSubject.next(true);
        return Observable.of(false);
      }

      this.oAuthService.refreshToken().then(() => 
      {
        console.log("refreshed token");
        this.authUserService.requireLoginSubject.next(false);
        return Observable.of(true);
      }).catch(() => {
        this.router.navigateByUrl('/sessiontimeout');
        this.authUserService.requireLoginSubject.next(true);
        return Observable.of(false);
      });
    }
}

Answer 1

我想你忘了在刷新案例中添加返回:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean>
{
    this.authUserService.lastUrl = state.url;

    if (this.oAuthService.hasValidAccessToken()) {
      this.authUserService.requireLoginSubject.next(false);
      return Observable.of(true);
    } else {

      if (sessionStorage.getItem('refresh_token') === null) {
        this.router.navigate(['/sessiontimeout']);
        this.authUserService.requireLoginSubject.next(true);
        return Observable.of(false);
      }

      return Observable.fromPromise(this.oAuthService.refreshToken())
             .mergeMap(()=>{
                       this.authUserService.requireLoginSubject.next(false);
                       return Observable.of(true);
              })
             .catch(()=>{
                      this.router.navigateByUrl('/sessiontimeout');
                      this.authUserService.requireLoginSubject.next(true);
                      return Observable.of(false);
              });
}

编辑:将 promise 转换为 Observable，以便更轻松地连接运算符。