Axios- Node JS cookie 解析器返回一个空对象

Question

我正在做我的项目。当我使用 Axios 时，我运行遇到了一些我没有解决的问题。

在这里我看到了一个代表我情况的类似问题： Node JS cookie parser not working

这是我安装并导入了 Axios 的 React 代码：

useEffect(() => { 
        axios.get('http://localhost:5000/get-cookie')
            .then(response => {
                console.log(response.data);
            })
            
    }, [])

还有我的app.js代码

const express = require('express');
const cors = require('cors');
const mongoose = require('mongoose');
const Grid = require("gridfs-stream");
const cookieParser = require('cookie-parser');



const app = express();
const port = process.env.PORT || 5000;
require('dotenv').config()






//middleware
app.use(cors());
app.use(express.json());


// connecting to database

let gfs;
const uri = process.env.DB
mongoose.connect(uri, { useNewUrlParser: true, useCreateIndex: true, useUnifiedTopology: true });

const conn = mongoose.connection;
conn.once("open", function () {
  console.log("MongoDB database connection established successfully");

    gfs = Grid(conn.db, mongoose.mongo);
    gfs.collection("photos");
});



// cookie routes 
app.use(cookieParser());

app.get('/set-cookie/:id', (req, res) => {
  res.cookie("User_ID",  req.params.id, {maxAge: 1000 * 60 * 60 * 24 * 31, httpOnly: true})

  res.json("You setted the cookies")
});



app.get('/get-cookie', (req, res) => {

    var cookies = req.cookies
    res.json(cookies)
});


// custom routes
const notes_router = require('./routes/notes')
const avatar_router = require('./routes/avatar');
const user_router = require('./routes/user');

app.use(avatar_router);
app.use(user_router);
app.use(notes_router);

app.listen(port, () => {
    console.log(`Server is running on port: ${port}`);
});

module.exports = gfs

我在 postman 上测试了这些并且它们有效。所以我需要帮助

Answer 1

Axios 默认不发送 cookie，但您可以将选项 withCredentials 作为 true 传递，它应该可以工作

useEffect(() => { 
   axios.get('http://localhost:5000/get-cookie',{withCredentials: true})
     .then(response => {
          console.log(response.data);
     })      
}, [])

编辑：您还必须在您的 Express 应用程序上设置 CORS 策略才能正常工作，您可以尝试以下中间件（假设您的 React 应用程序是运行 on localhost:3000，您可以改变它匹配你）：

app.use(function(req, res, next) {
  res.header('Access-Control-Allow-Origin', 'http://localhost:3000');
  res.header('Access-Control-Allow-Credentials', true);
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
  next();
});

或者您也可以使用 CORS npm 包。

Axios- Node JS cookie 解析器返回一个空对象

Axios- Node JS cookie parser is returning a empty object

cookies

node.js

reactjs

axios