Как реализовать ролевую модель в Angular?

Question

[Ghoulll]

Как корректно реализовать роуты в зависимости от роли? На данный момент, универсальная страница это новости куда попадают все авторизованные пользователи, но пользователи с определенной ролью должны попадать в другой раздел.
cabinet.routing.ts file:

const cabinetRoutes: Routes = [
  { path: '', redirectTo: 'news', pathMatch: 'full' },
  { path: '', component: LayoutComponent, children: [
      { path: 'news', loadChildren: () => import('./modules/news/news.module').then(m => m.NewsModule) },
      { path: 'analytics', loadChildren: () => import('./modules/analytics/analytics.module').then(m => m.AnalyticsModule) },
      { path: 'declaration', loadChildren: () => import('./modules/declaration/declaration.module').then(m => m.DeclarationModule) },
      { path: 'directory', loadChildren: () => import('./modules/directory/directory.module').then(m => m.DirectoryModule) },
      { path: 'documents', loadChildren: () => import('./modules/documents/documents.module').then(m => m.DocumentsModule) },
      { path: 'reestr', loadChildren: () => import('./modules/reestr/reestr.module').then(m => m.ReestrModule) },
      { path: 'orgInformation', loadChildren: () => import('./modules/org-information/org-info.module').then(m => m.OrgInfoModule) },
      { path: 'dashboard', loadChildren: () => import('./modules/dashboard/dashboard.module').then(m => m.DashboardModule) },
      { path: 'admin', loadChildren: () => import('./modules/admin/admin.module').then(m => m.AdminModule) },
    ],
  },
];

авторизованного пользователя перекидывает в cabinet
auth.service.ts file:

...
          this.authService.sendSignedPhraseToServer(this.signedCert).subscribe( responseWithJWT => {
            localStorage.setItem('someKey', responseWithJWT.token);
            this.user = this.authService.getToken;
            this.user = jwt_decode(this.user);
            this.router.navigate(['/cabinet']);
          });

app-routing module:

const appRoutes: Routes = [
  { path: '', pathMatch: 'full', redirectTo: 'cabinet' },
  {
    path: 'auth',
    loadChildren: () => import('./modules/auth/auth.module').then(m => m.AuthModule),
  },
  {
    path: 'cabinet',
    loadChildren: () => import('./modules/cabinet/cabinet.module').then(m => m.CabinetModule),
    canLoad: [AuthGuard],
  },
];

Answer 1

[Антон Швец]

Как написать роутинг, чтобы при .....

"Роутинг" это связь между роутом и соответсвующим компонентом.

.... чтобы при авторизации был редирект на разные страницы?

Вот при авторизации и navigate куда нужно.

Если вы хотите чтобы cabinet был универсальным маршрутом и при этом лейзилоад, то лейзи придется делать вложенные в него, т.е. дополнительные суброуты. Сам список роутов не предусматривает никакую логику.
Но логику можно поместить в гвард или резолвер. Это ж фактически middleware в роутере.

Comments

[Ghoulll]

... вложенные в него, т.е. дополнительные суброуты.

Не совсем понял, что это значит, разве сейчас лейзилоадинг не вложен в роут cabinet?

{ path: '', component: LayoutComponent, children: [
      { path: 'news', loadChildren: () => import('./modules/news/news.module').then(m => m.NewsModule) },
      { path: 'analytics', loadChildren: () => import('./modules/analytics/analytics.module').then(m => m.AnalyticsModule) }

[Антон Швец]

Ghoulll, у вас непонятно, сначала одни routes, потом другие routes.
Кстати хорошая привычка, называть их конкретно, типа cabinetRoutes

[Ghoulll]

Антон Швец, Вы правы, вопрос изначально не понятен. Вопрос исправил. Спасибо, за совет.

[Антон Швец]

Ghoulll, как я понимаю в вашем случае нужно просто сделать логику после авторизации.

[Ghoulll]

Антон Швец, Да, нужно чтобы авторизованного пользователя кидало на роут cabinet, а дальше определялось, в зависимости от роли, в какой раздел его кинуть. Например: если роль пользователя - user, то попадает в раздел новостей, а если admin, то в раздел админа.

[Антон Швец]

Ghoulll, а если админ захочет открыть новости?

[Ghoulll]

Антон Швец, у админа в sidebar'е не будет функционала чтобы вообще попасть в новостной раздел

[Антон Швец]

Ghoulll, а если завтра будет? Хороший программист всегда думает о возможных путях развития своего кода.

[Ghoulll]

Антон Швец, Да, но, если заказчик гос. орган и сам составляет ТЗ и хочет видеть именно такую ролевую модель с именном таким роутингом.