Использование значения из Promise внутри углового наблюдаемого перехватчика - PullRequest
Новая
       26

Использование значения из Promise внутри углового наблюдаемого перехватчика

0 голосов
/ 20 февраля 2019

Я пытаюсь использовать службу перехватчика JWT для аутентификации каждого звонка, который пользователь делает с API для приложения Ionic 4.У меня есть перехватчик JWT, который выглядит так 

export class JwtInterceptor implements HttpInterceptor {
  constructor(private authenticationService: AuthenticationService) { }

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // add authorization header with jwt token if available
    let token = 'THE_JWT_HERE'
    if (token) {
      request = request.clone({
        setHeaders: {
          Authorization: `Bearer ${token}`
        }
      });
    }

    return next.handle(request);
  }
}

Это работает статически, чтобы добавить токен в правильный заголовок запроса.Однако мне нужно получить фактический JWT пользователя из хранилища Ionic, которое обещано на основе.

Я подумал, что это может выглядеть примерно так: 

export class JwtInterceptor implements HttpInterceptor {
  constructor(private authenticationService: AuthenticationService) { }

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // add authorization header with jwt token if available
    this.authenticationService.getJWT()
      .then(token => {
      if (token) {
        request = request.clone({
          setHeaders: {
            Authorization: `Bearer ${token}`
          }
        });
      }
    return next.handle(request);
  })
  }
}

Это ломается при компиляции, потому что явозвращая обещание вместо наблюдаемого.Однако если я помещу return next.handle(request) вне обещания, заголовок авторизации не будет добавлен.Я понимаю, почему это происходит, но я не уверен в решении.

Как я могу получить доступ к этому значению из обещания и использовать его внутри этого перехватчика?

1 Ответ

0 голосов
/ 20 февраля 2019

вы хотите использовать некоторые rxjs - одним из методов может быть switchMap: 

import { switchMap } from "rxjs/operators"; 
import { from as observableFrom } from "rxjs";

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  return observableFrom(this.authenticationService.getJWT())
    .pipe(
      switchMap(token => {
        if (token) {
          request = request.clone({
            setHeaders: {
              Authorization: `Bearer ${token}`
            }
          });
        }
        return next.handle(request);
      })
    ); 
}

по сути, вы хотите преобразовать это обещание в наблюдаемое и объединить его в наблюдаемую цепочку, что приведет к Observable<HttpEvent<any>> что перехватчик должен возвращать.

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

...