Angular Route Guards:或者vs.和

时间:2017-09-05 20:31:02

标签: angular typescript angular-routing roles angular-route-guards

我正在努力使用路线保护来保护我的Angular应用程序的前端。在过去与他们合作并在线进行研究时,在路线中添加多个警卫需要所有他们返回true以允许访问。

但是,如果我希望只有一个返回true以允许访问,该怎么办? (例如||而不是&&)

例如,我的路线保护在用户的令牌中查找某些角色:

@Injectable()
export class ActiveRoleGuard implements CanActivate {
    constructor(private sessionService: SessionService, private router: Router) { }


    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        let token = this.sessionService.getToken();

        if (!token) {
             return false;
        }

        if (token.role.toLowerCase().indexOf("active") < 0) {
            this.router.navigate(["/issue"]);
            return false;
        }

        return true;
    }
}

@Injectable()
export class AdminRoleGuard implements CanActivate {
    constructor(private sessionService: SessionService, private router: Router) { }


    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        let token = this.appSessionService.getToken();

        if (!token) {
            return false;
        }

        if (token.role.toLowerCase().indexOf("admin") < 0) {
            this.router.navigate(["/issue"]);
            return false;
        }

        return true;
    }
}

如果我要在路由器模块中正常组合它们,那就像......

{path: "someroute", component: SomeComponent, canActivate: [ActiveRouteGuard, AdminRouteGuard]}

...但这需要用户同时为ActiveAdmin。但是,如果我想强制执行Active Admin Manager该怎么办?

在API 上执行操作非常简单:

[Authorize(Roles = "Active")]
[Authorize(Roles = "Admin, Manager")]
public class SomeController : ApiController

但我如何在Angular中做到这一点?

1 个答案:

答案 0 :(得分:7)

您可以只使用可以“配置”的单个版本,而不是使用两个单独的CanActivate实现。为此,您可以利用Routedata属性。例如,在您的路线中,您可以执行以下操作:

{
    path: "someroute",
    component: SomeComponent,
    canActivate: [RoleRouteGuard],
    data: {
        requiredRoles: ["Role1", "Role2", "Role3"]
    }
}

使用此功能,您可以采用现有的CanActivate实现之一,并使其更通用。您可以通过requiredRolesdata访问ActivatedRouteSnapshot媒体资源。 e.g:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    const requiredRoles = route.data.requiredRoles;
    ....

一旦你有了这个,你可以检查令牌的角色是否在数组等等。

如果您拥有始终需要的Active角色,然后是AdminManager角色,则还可以将其扩展为具有多个data属性。例如,您可以拥有requiredRolesatLeastOneOfRoles并更新您的逻辑以相应地处理...此时有很多选项,但我认为您不需要帮助。