Обновление токена-перехватчика с использованием NGRX - PullRequest
Новая
       37

Обновление токена-перехватчика с использованием NGRX

1 голос
/ 13 октября 2019

поэтому я создал http inteceptor токена обновления, который ищет ошибку 401 в API, а затем пытается обновить токен пользователя.

Существует множество учебных пособий, посвященных тому, как обрабатывать обновление токенов, однако много, если не все из них просто используют службу в перехватчике, тогда как я хотел бы отправлять действияиспользуя NGRX.

Мои действия (см. Ниже) просты, REFRESH_TOKEN вызывает эффект, который вызывает конечную точку API, которая, как мы надеемся, вернет свежий токен для пользователя (у меня есть другие эффекты для обработки успеха / неудачи этого действия, перенаправьте или сохраните данные соответственно).

Моя первая попытка перехватчика: 

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        this.loaded$ = this.auth.pipe(select(selectAuthLoaded));
        this.loading$ = this.auth.pipe(select(selectAuthLoading));

        // @ts-ignore
        return next.handle(request).pipe(catchError(error => {
            if (error instanceof HttpErrorResponse && error.status === 401) {
                return this.handle401Error(request, next);
            } else {
                return throwError(error);
            }
        }));
    }

    private handle401Error(request: HttpRequest<any>, next: HttpHandler) {
        this.loading$.subscribe(isLoading => {
            this.storage.getItem('refresh_token').subscribe(refreshToken => {
                if (!isLoading && refreshToken) {
                    this.auth.dispatch(new RefreshToken(refreshToken));
                } else {
                    return next.handle(request);
                }
            });
        });
    }

}

Я думаю, что если это 401, запустите функцию handle401ERror. Во-первых, это проверяет, загружено ли состояние авторизации, и получает ли пользовательский токен обновления из локального хранилища (Это плохо, и он будет заменен на COOKIE, как только я получу это сообщение), если аутентификация загружена и есть токен обновления, тогда отправьте запросдействие REFRESH_TOKEN.

Это может привести к следующей ошибке: 

You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.

1 Ответ

0 голосов
/ 18 октября 2019

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

if (error.msg === 'invalid_token') {
  this.authService.dispatch(fromAuthStore.refreshToken());
  return this.authEffects.refreshTokenSuccess$.pipe(
    take(1),
    mergeMap(() => {
      return next.handle(this.setRequest(req));
    })
  );
} else {
  return throwError(error);
}

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

edit: вот ссылка, которая может дать немногобольше объяснений и предоставить альтернативы. По сути, вы заканчиваете тем, что слушаете ngrx. https://netbasal.com/listening-for-actions-in-ngrx-store-a699206d2210

...