角色守卫有时允许进入本地主机上的安全组件

Question

我的 RoleGuard 看起来像这样：

import { CanLoad, Route } from "@angular/router";
import { AuthenticationService } from "../_services";
import { Injectable } from "@angular/core";

@Injectable({ providedIn: 'root' })
export class RoleGuard implements CanLoad {

    constructor(private authService: AuthenticationService) { }

    canLoad(route: Route) {
        let authorities = route.data.roles;
        if (this.authService.hasAnyRole(authorities)) {
            return true;
        }
        return false;
    }

}

以及我在 authService 中的方法：

 hasAnyRole(roles: string[]): boolean {
        for (let i = 0; i <= roles.length; i++) {
            if (this.hasRole(roles[i])) {
                return true;
            }
        }
        return false;
    }

    hasRole(role: string): boolean {
        let authorities = this.getAuthority();
        return authorities.findIndex(a => a === role) > -1;
    }

app.routing.ts :

const appRoutes: Routes = [
    {
        path: 'login',
        component: LoginComponent,
        canActivate: [NoAuthGuard]
    },
    {
        path: 'password',
        component: PasswordComponent,
        canActivate: [NoAuthGuard]
    },
    {
        path: 'change-password',
        component: ChangePasswordComponent,
        canActivate: [ChangePasswordGuard]
    },
    {
        path: 'reset-password',
        component: ResetPasswordComponent,
        canActivate: [ResetPasswordGuard],
        resolve: {
            recoverPassword: ResetPasswordGuard
        }
    },
    {
        path: '',
        component: HomeComponent,
        canActivate: [AuthGuard],
        children: [
            {
                path: 'users',
                loadChildren: '../app/users/users.module#UsersModule',
                canLoad: [RoleGuard],
                data: { roles: ['AK.W.1'] }
            },
            {
                path: 'products',
                loadChildren: '../app/products/products.module#ProductsModule',
                canLoad: [RoleGuard],
                data: { roles: ['AK.W.1', 'AK.W.2'] }
            },
            {
                path: 'codes',
                loadChildren: '../app/codes/codes.module#CodesModule',
                canLoad: [RoleGuard],
                data: { roles: ['AK.W.1', 'AK.W.2'] }
            },
            {
                path: 'reports',
                loadChildren: '../app/reports/reports.module#ReportsModule',
                canLoad: [RoleGuard],
                data: { roles: ['AK.W.1','AK.W.2','AK.W.3'] }
            }
        ]
    },
    { path: '**', redirectTo: '' }
];

组件的用户授权角色在路径的数据中提供并在 AuthorizationService 中检查。方法从令牌获取用户角色，nextable 将它们与路径数据中提供的角色进行比较。问题是守卫不能正常工作。有时，它允许未经授权的用户在提供应用程序时首次登录后，让本地主机上的安全组件进入。你能告诉我我的守卫有什么问题吗？

Answer 1

问题可能出在 CanLoad。 CanLoad Gaurd 保护 module 被加载，但是一旦 module 被加载，CanLoad 守卫什么都不做。

例如，假设用户登录应用程序并导航到某个模块。之后，他单击注销。现在，如果用户需要，他将能够导航到相同的模块，因为它已经被加载了。

所以如果你想保护你的应用程序，最好的办法是使用CanActivate。

Add CanActivate into your RoleGaurd

import { CanLoad, CanActivate, Route,Router,
 ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { AuthenticationService } from "../_services";
import { Injectable } from "@angular/core";

@Injectable({ providedIn: 'root' })
export class RoleGuard implements CanLoad, CanActivate {

    constructor(private authService: AuthenticationService,private router: Router) { }

    canLoad(route: Route) {
        let authorities = route.data.roles;
        if (this.authService.hasAnyRole(authorities)) {
            return true;
        }
        return false;
    }

 canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        let authorities = route.data.roles;
        if (this.authService.hasAnyRole(authorities)) {
            return true;
        }
        return false;
     }

   }

角色守卫有时允许进入本地主机上的安全组件

Role guard sometimes allows entry into secured components on localhost

authorization

roles

guard

typescript

angular