Угловая маршрутизация на основе ролей - PullRequest
Новая
       8

Угловая маршрутизация на основе ролей

0 голосов
/ 05 февраля 2019

Я использую Angular, и это для проверки подлинности: 

export class EnsureAuthenticated implements CanActivate {
    constructor(private auth: AuthService, private router: Router) {}
    canActivate(): boolean {
        if (localStorage.getItem('token')) {
            return true;
        }
        else {
            this.router.navigateByUrl('/login');
            return false;
        }
    }
}    

{ 
    path: 'path', 
    component: myComponent,
    canActivate: [EnsureAuthenticated]
}

Работает нормально, но моя проблема в том, что эта страница может быть доступна как пользователю, так и администратору.

Я знаюЯ не ставил никаких условий на это.Как мне установить для него правильные условия?

Я не хочу получать доступ к этой странице для администратора

Ответы [ 2 ]

0 голосов
/ 05 февраля 2019

Вы должны создать RoleGuardService, который ожидает роль от пользователя и проверяет, равна ли эта роль ожидаемой роли, например: 

  constructor(public auth: AuthService, public router: Router) {}

  canActivate(route: ActivatedRouteSnapshot): boolean {

    // this will be passed from the route config
    // on the data property
    const expectedRole = route.data.expectedRole;

    const token = localStorage.getItem('token');

    // decode the token to get its payload
    const tokenPayload = decode(token);

    if (
      !this.auth.isAuthenticated() || 
      tokenPayload.role !== expectedRole
    ) {
      this.router.navigate(['login']);
      return false;
    }
    return true;
  }

И защищает вашу маршрутизацию с помощью пользовательских ролей, например:

{ 
    path: 'admin', 
    component: AdminComponent, 
    canActivate: [RoleGuard], 
    data: { 
      expectedRole: 'admin'
    } 
  },

В этом сценарии предполагается, что вы используете пользовательскую заявку на роль в своем JWT, для получения дополнительной информации я советую вам прочитать эту статью, в которой подробно объясняется ваш ответ: https://medium.com/@ryanchenkie_40935/angular-authentication-using-route-guards-bf7a4ca13ae3

0 голосов
/ 05 февраля 2019

Предполагая, что у вас есть служба для извлечения роли подключенного пользователя, вам просто нужно проверить эту роль и вернуть false, если пользователь является администратором, чтобы запретить таким пользователям доступ к вашим страницам.Если токен, который вы храните в хранилище lcoal, является токеном JWT, иногда в него закодирована роль пользователя, вам необходимо декодировать токен для извлечения роли.

...