Попросите пользователя снова войти в систему после истечения срока действия токена в React JS

#reactjs #authentication #token #unhandled-promise-rejection

Вопрос:

У меня есть следующий фрагмент кода, который выполняет аутентифицированную выборку. В настоящее время, если я оставляю приложение запущенным и остаюсь неактивным более 2 часов, срок действия моего токена аутентификации истекает, и сервер возвращает ошибку (мне нужно обновить страницу вручную и снова войти в систему).

Что я хочу, так это следующее: Когда я получаю необработанный отказ(ошибка типа) от authFetch, чтобы перезагрузить страницу. Таким образом, пользователь может снова войти в систему, не увидев ошибки.

Вот код для этого:

 useEffect(() => {
authFetch('/api/business/spaces', {
  method: 'GET',
  headers: { 'Content-Type': 'application/json' },
})
  .then((response) => response.json())
  .then((resp) => setSpaces(resp.spaces))
  .catch((error) => {
    console.log(
      'TokenExpired, can not connect to server (refreshing page...):'
    )
    console.log(error)
    window.location.href = window.location.href   ''
  })
 

Моя проблема в том, что:
Когда я запускаю интерфейс/серверную часть, страница сразу же начинает обновляться без остановки. Это как если бы он постоянно ловил ошибки.

Могу ли я изменить это так, чтобы страница обновлялась только тогда, когда я обнаруживаю необработанную ошибку отклонения, а не просто какую-либо ошибку?