Блог

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

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

я пытался использовать перенаправление и с react, но поскольку react имеет собственную систему маршрутизации (react-router-dom), а express нужен только для создания API, когда я входил в систему / profile 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();
    });
  }
};
  

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

 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), чтобы ответить. Это был ответ на запрос до того, как он попал на фактический маршрут.