Как проверить токен jwt на фронте и передать его в backend

kirilljsx

Этот код реализует проверку наличия JWT-токена в браузере и, при его наличии, выполняет валидацию токена на сервере.

const tokenCheck = () => {
    const token = localStorage.getItem('jwt');

    if(token) {
      auth.checkToken()
      .then((res) => {
        if(res) {
          enableLogin();
          setUserEmail(res.email);
          navigate('/', {replace: true});
        }
      })
      .catch(err => console.warn(err));
    }
  }

Давай разберу пошагово:

Извлекает токен из localStorage:

const token = localStorage.getItem('jwt');

Пытается получить сохранённый JWT-токен под ключом 'jwt'.

Проверяет, существует ли токен:

if (token) { ... }

Если токена нет — функция завершает работу.

Отправляет запрос на сервер для проверки токена:

auth.checkToken()

Предполагается, что auth.checkToken() — это асинхронная функция (например, fetch или axios), которая отправляет токен на бэкенд и проверяет его валидность. Обычно такой эндпоинт возвращает данные пользователя (например, email), если токен действителен.

Обрабатывает успешный ответ:

.then((res) => {
  if (res) {
    enableLogin();          // Например, активирует UI-состояние "авторизован"
    setUserEmail(res.email); // Сохраняет email пользователя в состояние (например, через React-хук)
    navigate('/', { replace: true }); // Перенаправляет на главную страницу, заменяя текущую запись в истории
  }
})

Если сервер вернул валидные данные (res не null/undefined),
приложение считает пользователя авторизованным и обновляет UI/состояние,
а затем перенаправляет пользователя на корневой маршрут (/), заменяя текущую страницу в истории навигации (используется replace: true → пользователь не сможет вернуться кнопкой «Назад» на страницу входа или загрузки).

Обрабатывает ошибки:

.catch(err => console.warn(err));

При ошибке (например, токен просрочен, сервер недоступен) - просто выводит предупреждение в консоль, но не прерывает выполнение.

Функция tokenCheck - это типичный механизм «тихой» автоматической авторизации при запуске приложения: если токен есть и валиден, пользователь сразу считается вошедшим в систему и перенаправляется на главную страницу.

itrace

Я ранее с таким не сталкивался. Благодарю за полезный материал)))