angular - 即使返回 true，当调用刷新令牌 api 时，Angular CanActivate 也不会路由到新路由

Question

我一直致力于在 Angular 6 项目中添加路由保护和令牌拦截器。

在路由守卫的 canActivate 中，我调用了一个异步方法来检查访问令牌是否已过期：

1. 如果是，则检查刷新令牌是否过期，如果也过期，则将用户注销，否则，使用刷新令牌获取新的访问令牌。

2. 如果否，则将用户导航到该路线。

但是，只要访问令牌过期（第 1 点），就不会导航到该路由。我已经尝试了所有方法和所有组合，但它仍然有效。

AuthGuard.service.ts

  async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

    const isAuthenticated = await this.auth.isAuthenticated();
    if (isAuthenticated) {
      return true;
    } else {
      return false;
    }
}

---

Auth.service.ts

  public async isAuthenticated() {
    // Check whether the token is expired and return true or false
    const token = sessionStorage.getItem('token');
    if (token) {
      if (await this.checkTokenValidity(token)) {
        return true;
      } else {
        return false;
      }
    }
    return false;
  }

---

public checkTokenValidity = async (token) => {
    //checking if access token is valid or not
    const isAccessTokenExpired = this.tokenService.tokenExpiry(token);
    if (isAccessTokenExpired) {
      const response = await this.tokenService.getNewToken();
    }
    const isSignatureValid = this.tokenService.isSignatureValid(sessionStorage.getItem('token'));
    if (!isSignatureValid) {
      return false;
    }
    return true;
}

---

 getNewToken = async () => {
    const url = 'api/refresh/';
    const refreshToken = Object.assign({}, { refresh: refreshToken });
    sessionStorage.removeItem(TOKEN);
    // if refresh token has expired then log the user out.
    if (this.tokenExpiry(refreshToken)) {
      sessionStorage.clear();
      this.router.navigate([''])
      return;
    }
    return this.apiService.postData(url, refreshToken).toPromise();
  }

Answer 1

在您的构造函数中注入Router实例，当您的条件（令牌到期）不满足时，将用户路由到您的Logout 组件。

constructor(private router: Router) { }

async canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

    const isAuthenticated = await this.auth.isAuthenticated();
    if (isAuthenticated) {
      return true;
    } else {
      this.router.navigate(['/logout']);
    }
}