Проверка токена JWT на главной странице

Question

перед тем, как я начал работать сactJS, я использовал экспресс-сессии (конечно, с expressJS), чтобы определить, был ли пользователь аутентифицирован или нет, мое промежуточное ПО было передано в / profile URL, как это router.use('/profile', middleware, require('./profilePageFile')), и если пользователь не был аутентифицирован, я был перенаправление на страницу входа с простым кодом

if(!req.session.user){
  res.redirect('/login')
}

Я тоже пытался использовать перенаправление с реакцией, но так как у реакции есть своя собственная система маршрутизации (activ-router-dom), а экспресс требуется только для создания API, когда я входил в систему / URL-адрес профиля, он по-прежнему отображал мне содержимое страницы и переадресация меня через xxx миллисекунд спустя, и я думаю, что было бы лучше, если бы у меня была страница профиля и главная страница по URL-адресу по умолчанию ('domain.com/'), так как я вижу, что многие веб-сайты используют эту технику, включая Facebook, в данный момент Я пытался сделать что-то вроде этого: если у пользователя нет токена или токен истек, не отображайте какую-либо кнопку «Привет, пользователь», иначе отображайте ее. Моя единственная проблема в том, что я не знаю, как это сделать. если в моем реагирующем состоянии есть логическое значение isAuthenticated или что-то в этом роде, которое определяет, аутентифицирован ли пользователь в соответствии с заголовком, который я отправляю со стороны сервера, я думаю, это будет плохой практикой для безопасности, а также когда я попытался что, это все равно не сработало. на данный момент единственное, что я могу сделать, это передать клиенту req.userId, если токен существует. это работает, но этого недостаточно, если кто-то получил точку, я буду рад, если я получу помощь вот мой код промежуточного программного обеспечения

const guard = (req, res, next) => {
  const token =
    req.body.token ||
    req.query.token ||
    req.headers["x-access-token"] ||
    req.cookies.token;

  if (!token) {
    res.status(401).send({ auth: false });
  } else {
    jwt.verify(token, process.env.SECRET, function(err, decoded) {
      if (err) {
        return res.status(500).send({
          message: err.message
        });
      }

      req.userId = decoded.id;
      res.status(200).send({ auth: true });
      next();
    });
  }
};

Answer 1

Я сделал два изменения в вашем коде.

const guard = (req, res, next) => {
    const token = req.body.token ||
        req.query.token ||
        req.headers['x-access-token'] ||
        req.cookies.token;

    if (!token) {
        // Authentication failed: Token missing
        return res.status(401).send({ auth: false })
    }

    jwt.verify(token, process.env.SECRET, function (err, decoded) {
        if (err) {
            // Authentication failed: Token invalid
            return res.status(401).send({
                auth: false,
                message: err.message
            })
        }

        req.userId = decoded.id
        next()
    })
}

Во-первых, внутри условия if(err) я изменил код состояния на 401, потому что если токен недействителен, он выдаст ошибку здесь.

Во-вторых, я удалил res.status(200).send({auth:true}) из нижней части функции. Это связано с тем, что промежуточное программное обеспечение должно отвечать на маршрут (который мы пытаемся защитить с помощью проверки JWT) для ответа. Это было ответом на запрос, прежде чем он добрался до фактического маршрута.