2

我有一个应用程序，其中有两个警卫（MsalGuard - 用于身份验证，AuthGuard - 编写自己的代码来授权用户是否有权访问该特定页面）。在加载模块时使用延迟加载。请找到下面提到的代码

应用程序路由.module.ts

      { 
        path: 'administration',
        loadChildren: () => import('./administration/administration.module').then(m => 
        m.AdministrationModule),
       // loadChildren: './administration/administration.module#AdministrationModule',
       canActivate: [MsalGuard],
      },

administration-routing.module.ts

           path: '',
    //canActivate: [AuthGuard],
    component: AdministrationComponent,

       children: [
         {
           path: 'user-admin/user-list',
           children: [
              { path: '', component: UserListComponent, canActivate: [AuthGuard] },
              { path: 'user-creation', component: UserCreationComponent, canActivate: [AuthGuard] },
           ]
         },

auth.guard.ts

     canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        const currentUser = this.authenticationService.currentUserValue;
        if (currentUser) {
            return this.hasAdminAccess(state, currentUser);
        } 
        this.router.navigate(['/login'], { queryParams: { returnUrl: state.url } });
        return false;
    }

这里的主要问题是，如果我们登录一次并能够进行相应的授权，它会按预期工作。但如果我清除了总缓存并直接打开其中一个组件页面，那么它会询问 MsalAuth 并提供详细信息，但到那时AuthGuard 可能被执行并且用户详细信息为空并且它在未经授权的情况下打开页面。

4

1 回答 1

0

我最终通过检查我自己的后卫的canactivate中的登录过程来解决它：

export class UserGuardService {
    
constructor(private userSrv: EmployeeService, private msalBroadcastService: MsalBroadcastService) { }
    
      canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
        return this.msalBroadcastService.inProgress$
        .pipe(
          filter((status: InteractionStatus) => status === InteractionStatus.None)
          )
        .pipe(() => {
          //Getting the user from the service, this needs accesstoken first, so msal need to be completed
          return this.userSrv.getUser().pipe(
            filter(user => !!user),  // Filter NULL value here before sending object further
            map(user => {
              let hasRights = true;
              //Check on roles
              return hasRights;
            }));
        });
      }
    }

那么你确定它在登录过程完成后被调用！

于 2021-12-14T15:21:58.123 回答