Как перед основным запросом, делать дополнительный?

Question

[Егор Астрейко]

Всем привет, подскажите как указать в настройках axios nuxt.js, что бы перед любым запросом на сервер, axios проверял истекло ли время жизни access токена, если да, то перед основным запросом делал запрос на обновление токена и после успешной обновлении токена, уже переходил к основному запросу ?

Что я имею ввиду:
Допустим access токен живет 5 минут, пользователь прошел аутентификацию, его access токен и время жизни записались в cookie, refsresh в localStorage, а данные в store. Он ни чего ни делал 6 минут, время жизни access токена истекло, он обновляет страницу, данных в store нету, происходит запрос для получения его данных, там сервер отправляет ошибку 401 и эта ошибка видна в консоли. А я хочу что бы перед запросом данных пользователя, если есть access токен и его время жизни, axios проверял истекло ли время жизни, если да, то он сразу обновил токен, а после удачного обновления уже стучался по адресу, что бы получить данные пользователя.

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

Answer 1

[Aetae]

Это обычный способ.

axios.interceptors.request.use(async config => {
  const token = await getToken(); // тут либо отдаём живой токен сразу, либо получаем новый
  config.headers.Authorization = 'Bearer ' + token;
  return config;
});

Ошибок ждать не надо.

Но вообще, у nuxt есть свой auth модуль, где всё уже заранее продумано и предусмотрено, так что лучше юзай его.

Comments

[Егор Астрейко]

Спасибо, только у меня два вопроса, так как не сильно в nuxt
1) Куда нужно interceptors кидать ?
2) Куда нужно кидать функцию getToken &

[Aetae]

Егор Астрейко, куда хочешь туда и кидай. Best practice - это юзать auth модуль, а иначе ты сам хозяин своему коду.)

Answer 2

[Алексей Ярков]

Нормальный способ. Надо реагировать на ошибку 401 и выполнять запрос за новым токеном, а потом повторять нужный запрос.