На странице refre sh: проблема отправки магазина ngrx с защитой - PullRequest
Новая
       75

На странице refre sh: проблема отправки магазина ngrx с защитой

0 голосов
/ 02 мая 2020

У меня нет страницы входа, это вызов sso

В компоненте приложения я отправил действие для загрузки вызова токена на стороне сервера и получения токена на основе ролей пользователя. Я могу активировать охрану в маршрутизации. если защита активирует возвращаемое значение true, я буду go на странице панели инструментов.

На странице панели инструментов у меня есть refre sh в URL-адресе браузера, я могу активировать execute до эффектов действия входа в систему, поэтому могу активировать return false и страница отображается пустой.

В панели мониторинга есть дочерние маршруты, также есть некоторые дочерние ссылки, такие как панель инструментов / products products, также есть активированная защита, но она может активировать функцию возврата false до того, как действие отправки рассылки входа будет успешным. call.

Может кто-нибудь помочь мне, что я делаю неправильно?

здесь маршрутизация, 

  {
    path: '',
    component: HomeComponent,
    canActivate:[AuthGuard],
    children: [
      {
        path: 'product',
        loadChildren: () => productModule
      },
      {
        path: 'order',
        loadChildren: () => orderModule
      }
    ]
  },

здесь метод активации: здесь я получаю успех от вызова эффектов при отправке действия из app.component: 

  canActivate(): Observable<boolean> {
     return this.store.select(appState => appState.auth.isAuthenticated)
      .pipe(map(authUser => {

        if (!authUser) {
          return authUser;
        }
        return authUser;
      }))
    }

App.comp onet: 

ngOnInit(){



   this.onSubmit();

}

onSubmit(): void {
  const payload = {
    email: 'test@test.com',
    password: 'admin'
  };
  alert('dispatch an action');
  this.store.dispatch(new LogIn(payload));
}

проблема только в ссылке refre sh. при нажатии на ссылку роутера логи c работает нормально.

мое начальное состояние: 

export const initialState: State = {
  isAuthenticating:false,
  isAuthenticated: false,
  user: null,
  errorMessage: null
};

скриншот потока: enter image description here

1 Ответ

0 голосов
/ 02 мая 2020

Я думаю, что у вас есть проблема с асинхронизмом. Когда вы обновляете страницу sh, хранилище должно инициировать состояние со значением false, и перед тем, как вы получите ответ от своего бэкэнда, будет произведена проверка. Существует много возможных решений, но на основе выставленного вами кода и защиты я сделаю следующее:

Создайте флаг в хранилище, чтобы узнать, ожидаете ли вы ответ аутентификации, например isAuthenticating тогда в твоей охране можно сделать что-то вроде: 

canActivate(): Observable<boolean> {
        return new Observable(observer => {
           this.store.select(appState => appState.auth.isAuthenticating)
               .pipe(filter(isAuthenticating => !isAuthenticating))
               .subscribe(() => {
                  this.store.select(appState => appState.auth.isAuthenticated).pipe(
                      take(1)
                  ).subscribe(isAuthenticated => {
                      observer.next(isAuthenticated);
                      observer.complete();
                  })
          })
     }
   }

Надеюсь, эта помощь

...