Как добиться перенаправления на основе ролей после входа в Angular-5? - PullRequest
0 голосов
/ 04 июля 2018

Я новичок в Angular, и я использую Angular-5. В моем приложении у меня есть 2 экрана / компоненты, которые называются « Admin-Dashboard » и « HR-Dashboard ». Мой маршрут по умолчанию /Admin-Dashboard, посмотрите следующие маршруты:

const routes: Routes = [
    {
    path: 'Admin-Dashboard',
    component: AdminDashboardComponent,
    canActivate: [AuthGuard]
  },
  {
    path: HR-Dashboard',
    component:HRDashboardComponent,
    canActivate: [AuthGuard]
  }
  // otherwise redirect to home
  { path: '**', redirectTo: '/Admin-Dashboard', canActivate: [AuthGuard] }];

Если пользователь не вошел в систему, my AuthGaurd перенаправляет пользователя на экран входа в систему, то пользователь входит в систему со своими действительными учетными данными. Когда пользователь входит в систему, пользователь перенаправляется на /, то есть маршрут по умолчанию, который затем автоматически перенаправляется на /Admin-Dashboard.

Моя проблема в том, что я должен перенаправить пользователя, вошедшего в систему, в соответствии с его ролью (HR или ADMIN). Если user.role=="ADMIN", перейдите в Панель управления администратора, Если user.role == "HR", перейдите в Панель управления персоналом.

В настоящее время мой подход заключается в том, что пользователь сначала перенаправляется на /Admin-Dashboard из-за настроек маршрута по умолчанию, затем в его конструкторе я проверяю роль пользователя и, если это HR, я перенаправляю пользователя на «HR-панель», используя router.navigate(). Это работает нормально, но в адресной строке сначала отображается / Admin-Dashboard, а затем перенаправляется на HR-Dashboard.

if(this.authService.currentUser.role=='HR'){
      this.router.navigate(['HR-Dashboard']);

    }

Я ищу какой-то лучший подход для достижения той же функциональности. Есть ли способ, с помощью которого я могу проверить в самой маршрутизации, является ли пользователь admin или hr, и перенаправить соответственно?

Обновление: Извините, я забыл упомянуть большую вещь, я использую Gluu (сторонний сервер аутентификации) в качестве сервера аутентификации, который перенаправляет пользователя на URL моих приложений (https://ip/port например, 'https://192.168.55.10:4200'), если пользователь успешно вошел в систему. У меня нет элемента управления, чтобы изменить навигацию с gluu, он будет перенаправлять только на мой URL-адрес по умолчанию вместе с пользовательскими данными. Даже экран входа в систему не является частью моего приложение, оно размещено на cloude, и я перенаправляю на страницу входа, используя OIDC_Settings и AuthGaurd в моем файле конфигурации среды.

Заранее спасибо.

Ответы [ 3 ]

0 голосов
/ 04 июля 2018

Во-первых, конструктор компонента выполняет First.

, поэтому, когда нажата кнопка входа в систему на странице входа в систему,

Выполните операцию «Является ли он администратором или hr», затем перенаправьте страницу в компонент ADMIN или HR-компонент.

Мое предположение, что это может быть лучше.

Попробуйте и проверьте.

Спасибо

0 голосов
/ 05 июля 2018

для вашего обновления:

  1. Просто создайте пустой компонент и в конструкторе - выполните проверку и отправьте URL на соответствующую страницу.

  2. Большинство веб-сайтов, таких как JUSPAY, PAYTM и т. Д., При оплате через этот сайт проверяются на одной странице и переходят на необходимый URL-адрес.

Например: если вы бронируете билет в Redbus, оплатите через кошелек AMAZON PAY. Вы можете увидеть это перенаправление URL.

Спасибо. Надеюсь, что это может быть полезным.

0 голосов
/ 04 июля 2018

Лучший и эффективный подход - это проверить роль во время успешного входа в систему и перенаправить оттуда на соответствующую панель.

Измените ваше перенаправление по умолчанию с помощью логики, которая проверяет роль и перенаправляет соответственно.

...