Reactjs 无法在浏览器中的Cookie中存储json web令牌

因此，我学习了使用cors npm在MERN项目中进行用户登录的JWT身份验证。我能够生成JWT并将其存储在数据库中，但我无法看到我的cookie存储在浏览器中

这是express server中模式文件中的generateAuthToken（）函数，我在这里生成一个jwt&返回它-

userSchema.methods.generateAuthToken = async function(){
try{
        //generate token
        const token = jwt.sign({_id:this._id.toString()} , process.env.SECRET_KEY);
        
        //stored the generated token in our document
        this.tokens = this.tokens.concat({token : token});

        //saved the changes made in the document
        await this.save();

        //returning the token generated when called
        return token;

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

}

并调用express server中index.js中的generateAuthtoken（）函数。返回的令牌存储在“token”中-

const token = await userLogin.generateAuthToken();
        //console.log(token);


    //storing logged in tokens inside cookies
        res.cookie("logintoken" , token , {
            expires : new Date(Date.now() + 60000), //60sec from the time we store the token inside the cookie
            httpOnly : true
        });

在前端react代码中，我在fetch api中发送了一个凭证头，该头调用位于端口4000的express服务器中的登录路由-

const response = await fetch('http://localhost:4000/login',{
                method : "POST",
                credentials: 'include',
                headers : {
                    "Content-Type" : "application/json"
                },
                body : JSON.stringify({
                        email : email,
                        password : password
                })
        });

我正在使用cors npm包处理express服务器中的跨区域请求-

   const cors = require('cors');

   app.use(cors());

在我的浏览器控制台中，我面临这个错误-

但当我签入浏览器时，cookie并没有存储在存储器中-

总之，我正在生成一个jwt并在函数中返回它。然后将返回的令牌存储在名为“logintoken”的cookie中。但该cookie不会存储在浏览器中

---

我对此进行了研究，发现一些线程表明，我们还必须在cors中定义一些头文件，以便浏览器能够存储cookie。但我无法确定如何添加以及需要哪些头文件才能实现这一点。我以前使用过cookies&jwt，但这是我第一次使用react，express&cors npm学习。感谢您的回复。

这里是我当前应用程序的代码片段

app.use(
    cors({
        credentials: true,
        origin: `http://${process.env.REACT_APP_SERVER_HOST}:${process.env.PORT}`,
    })
);

---

查看此软件包@Medi我阅读了“配置选项”部分，其中提到了“访问控制允许源代码”，但我无法理解。你能给我一个如何使用它的示例吗？谢谢你的回复。我引用了这个链接-所以我需要将我的前端反应http地址放在origin内，对吗？我相信在使用Cookie的情况下，它不接受all origin

*

值。我添加了

app.use（cors（{凭据：true，origin:'http://localhost:3000' }));

和cookie已存储在浏览器中，但显示了一条警告，说明

cookie“logintoken”将很快被拒绝，因为它的“SameSite”属性设置为“None”或无效值，而没有“secure”属性试试看是否有效。我添加了
SameSite:'none'
，现在出现了一个错误，说
cors请求未成功
。