Question

我正在尝试在我的角度项目上实现RoleGuardService。我有一条保护路线，要求用户具有特定的角色。

export class RoleGuardService implements CanActivate {

  constructor(public loginService: LoginService, public router: Router) { }

  canActivate(route: ActivatedRouteSnapshot): boolean {

    const expectedRole = route.data.expectedRole;
    const userDetails = this.loginService.getUserDetails();

    if (userDetails != null) { 
      console.log('not null');

      userDetails.roles[0].forEach(e => {
        if(e.name === expectedRole){
          console.log('return true');
          return true;
        }
      });
    }

    this.router.navigate(['login']);
    console.log('return false');
    return false;
  }
}

点击具有expectedRole的用户的路线时，我看到了 not null，返回true，在控制台中返回false .. 我有canActivate返回布尔值。调用loginService.geUserDetails（）返回jwt deocoded，因此不确定为什么异步发生任何事情。

public getUserDetails() {
    return this.jwtHelper.decodeToken(sessionStorage.getItem('AuthToken'));
  }

请帮助，其他类似的问题涉及我在这里没有做的http请求。希望我想念的东西很简单。提前谢谢。

Answer 1

javascript array.forEach(...)只能通过抛出异常来停止（请参阅here）。

如果您想停止循环，只需使用简单的for-loop：

...
for(let i = 0; i < userDetails.roles[0].length; i ++) {
    let e = userDetails.roles[0][i];
    if(e.name === expectedRole){
        console.log('return true');
        return true;
    }
});
...

Answer 2

您在forEach范围内返回true。你必须在外面做：

export class RoleGuardService implements CanActivate {

  constructor(public loginService: LoginService, public router: Router) { }

  canActivate(route: ActivatedRouteSnapshot): boolean {

    const expectedRole = route.data.expectedRole;
    const userDetails = this.loginService.getUserDetails();

    if (userDetails !== null) { 
      console.log('not null');
      if (userDetails.roles[0].some(e => e.name === expectedRole)) {
          return true;
      }
    }

    this.router.navigate(['login']);
    console.log('return false');
    return false;
  }
}

祝你好运！

角度服务返回两次

2 个答案: