Oktauth не работает при использовании на сайте Angualr

#javascript #angular #typescript #okta #okta-api

Вопрос:

В моем приложении Angular у меня есть эта функция для перехода на страницу входа в систему:

 const oktaConfig = Object.assign({
  onAuthRequired: (oktaAuth: any, injector: { get: (arg0: any) => any; }) => {
    const router = injector.get(Router);

    // redirect the user to your custom login page
    router.navigate('/login');
  }
}, myAppConfig.oidc);
 

Один из моих маршрутов выглядит следующим образом:

 const routes: Routes = [
  { path: 'members', component: MembersPageComponent, canActivate: [ OktaAuthGuard ] },
...
];
 

и мой login.status.component.html содержит:

 <button routerLink="/members" class="security-btn ml-1">Member</button>
 

При нажатии кнопки «Участники» пользователь должен быть перенаправлен на страницу входа в систему, если он еще не вошел в систему. В моем приложении, если это сделано, на странице не происходит ничего видимого, но консоль выдает эту ошибку:

ОШИБКА Ошибка: Не поймано (в обещании): Ошибка типа: команды.сокращение не является функцией computeNavigation@http://localhost:4200/vendor.js:53359:26 createUrlTree@http://localhost:4200/vendor.js:53291:34 createUrlTree@http://localhost:4200/vendor.js:56121:16 navigate@http://localhost:4200/vendor.js:56190:40 onAuthRequired@http://localhost:4200/main.js:160:16 handleLogin/<@http://localhost:4200/vendor.js:69640:31 __ожидающий/js:140245:12 handleLogin@http://localhost:4200/vendor.js:69633:64 canActivate/<@http://localhost:4200/vendor.js:69623:24 fulfilled@http://localhost:4200/vendor.js:140246:58 invoke@http://localhost:4200/polyfills.js:598:26 onInvoke@http://localhost:4200/vendor.js:37134:33 invoke@http://localhost:4200/polyfills.js:597:52 run@http://localhost:4200/polyfills.js:360:43 Расписание решениепроекта/js:631:60 runTask@http://localhost:4200/polyfills.js:404:47 drainMicroTaskQueue@http://localhost:4200/polyfills.js:808:35 invokeTask@http://localhost:4200/polyfills.js:717:21 invokeTask@http://localhost:4200/polyfills.js:1826:14 globalZoneAwareCallback@http://localhost:4200/polyfills.js:1852:27 Угловой 11 разрешениепро-решениепро-решениепланированиесолвеорреект вызовзадачи onInvokeTask вызовзадачи запускзадачи дренажмикротасквызова вызовзадачи вызовзадачи globalZoneAwareCallback ядро.js:6479 Угловой 3 RxJS 5 Угловой 13

Я думаю, что моя проблема как-то связана с тем, как мои параметры передаются в моей функции. Правильно ли я это делаю, и если да, то что я делаю не так?

Ответ №1:

router.navigate('/login'); так и должно было быть router.navigate(['/login']); .