Question

我目前正在尝试使用React客户端设置一个Node / Express应用程序以与其进行交互。我设置护照以处理JWT的身份验证。用户登录后，我将验证电子邮件/密码。然后设置cookie：

res.cookie('jwt', token, { httpOnly: true, secure: false });

我看到令牌在响应标头中传回，但是当我在“开发人员工具”>“应用程序”>“ Cookie”下检查Chrome浏览器的Cookie时，看到了一个空Cookie。我在做什么错？如何在后续请求中的响应头中发送jwt？

服务器/App.js

const app = express()

app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json());

app.use(cookieParser());

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

app.post('/login', (req, res) => {
  passport.authenticate('local', { session: false }, (error, user) => {
    if (error || !user) {
      res.status(400).json({ error });
    }

    // Construct JWT payload
    const payload = {
      email: user.email,
      expires: Date.now() + parseInt(process.env.JWT_EXPIRATION_MS),
    };

    // Assign payload to req.user
    req.login(payload, {session: false}, (error) => {
      if (error) {
        res.status(400).send({ error });
      }
      // Generate a signed JWT
      const token = jwt.sign(JSON.stringify(payload), process.env.JWT_SECRET);

      // Assign JWT to cookie
      res.cookie('jwt', token, { httpOnly: true, secure: false });
      res.status(200).send({ email: user.email });
    });
  })(req, res);
});

client / LoginModal.js

  handleLogin = async () => {
    const { name, email, password } = this.state

    try{
      const res = await axios.post('http://localhost:8080/login', {
        email: email,
        password: password,
      })

      if(res.status == 200){
        console.log("Logged in")
        console.log(res)
      }

    } catch (err) {
      console.log(err)
    }
  }

编辑：我当前的解决方法是将令牌作为有效载荷的一部分发送。然后，我的React客户端从有效负载中获取令牌并将其存储在浏览器的Cookie中。有没有办法避免这种解决方法（例如，请参见下文）？

服务器

 res.status(200).send({ email: user.email, jwt: token });

客户端

  if(res.status == 200){
    cookies.set('jwt', res.data.jwt)
    cookies.set('email', res.data.email)
  }

Answer 1

在调用axis.post（）时，您必须传递for (var i = 0; i < @Model.Item1.Settings.Length; i++) { handleCheckbox(i); }作为第二个参数，只有这样，您的浏览器才会设置cookie。

Answer 2

您已设置了启用了httpOnly标志的cookie。大多数现代浏览器都通过开发人员工具来限制对此类Cookie的读取访问。您可以详细了解here。

如果您想在开发环境中查看cookie的内容，请将httpOnly设置为false。

res.cookie未在浏览器中设置cookie

2 个答案: