angular - 将 CanActivate() 委托(delegate)给组件

Question

我的 angular(4) 应用程序中有数十个组件。

只有有访问权限的用户才能访问。

• 例如，UserA 可以访问 DashboardComponent，但 userB 不能。

一些组件通过参数检查授权。

• 例如UserA可以通过参数1访问VisualizeComponent，但不能通过参数2访问。

有多种类型的访问授权或拒绝策略。

所以我想象一下将 CanActivate 方法委托(delegate)给每个组件怎么样，因为每个组件都是根据其目的检查访问权限的最佳位置。

我知道通常人们会像下面这样在服务中实现 CanActivate。

@Injectable()
export class AccessGuard implements CanActivate {
  canActivate(route: ActivatedRouteSnapshot, 
              state: RouterStateSnapshot) {

   route.component.canActivate(route, state); // <----- HERE

   return true;
  }
}

现在我可以在第 6 行调用一些方法吗？ 我想对我的所有组件实现 CanActivate 并让它们在该方法中拥有自己的保护登录。所以我很容易将守卫逻辑放在组件的业务逻辑附近。

Answer 1

1. 尝试添加一些 sessionService，它必须存储有关负责访问的参数的信息，添加一个关于您提供访问逻辑的方法。

2. 添加适当的方法

   @Injectable()
   export class AccessGuard implements CanActivate { canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
   constructor(private sessionService:SessionService) {}
   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
       return this.sessionService:SessionService.isAuthenticated();
   }}}
   

   1. 例如为组件和页面添加路由器配置 {path: 'dashboard-page, component: DashboardComponent, canActivate: [AuthenticationGuard]},

希望对你有帮助