Угловой перехватчик 401 обновить токен - PullRequest
Новая
       28

Угловой перехватчик 401 обновить токен

0 голосов
/ 12 декабря 2018

Хорошо, это должно быть легко решить, но из-за того, как приложение было разработано ранее, оно немного сложнее.Большинство ответов, которые я нахожу, не решают проблему, которую я пытаюсь решить.

По сути, я перехватываю вызовы API, и когда появляется 401, я хочу получить новый токен.Так как это приложение было разработано, у меня есть асинхронное действие, которое я могу вызвать, которое запускает вызов API для получения нового токена.Затем он сохраняет этот токен в localStorage.В магазине есть флаг, который отслеживает ход этого процесса.Поэтому сейчас мне нужно прослушать наблюдаемое, и после его завершения захватить новый токен из localStorage, а затем повторить вызов.

Примерно так: 

this.initRefreshFlag$.subscribe((val, i) => {
    if (val === InitFlagType.Done) {
        const newRequest = request.clone({
            setHeaders: {
                'Authorization':
                `${localStorage.getItem(TOKEN_TYPE)} ${localStorage.getItem(ACCESS_TOKEN_KEY)}`
            }
        });
        return next.handle(newRequest);
    }
});

Однако next.handle() не стреляет.И теперь я понимаю, что подписка не то, что я хочу использовать здесь из-за возможных утечек памяти.Я попытался использовать switchMap и mergeMap, но они не срабатывают при изменении наблюдаемого this.initRefreshFlag$.

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

1 Ответ

0 голосов
/ 12 декабря 2018

Я запутался в том, что не работало с switchMap или mergeMap, но по сути вы не можете ничего вернуть из subscribe().

В общем, если вы хотите выполнить один Observable, тогдаиспользуйте его значение для чего-то другого, чтобы продолжить с другой наблюдаемой, которую вы можете использовать mergeMap: 

this.initRefreshFlag$.pipe(
  mergeMap(val => {
    const newRequest = request.clone({
      setHeaders: {
        'Authorization': `${localStorage.getItem(TOKEN_TYPE)} ${localStorage.getItem(ACCESS_TOKEN_KEY)}`
      }
    });

    return next.handle(newRequest);
  })
)
...