Express Session路由切换时无法获取会话值的问题

在使用Express Session时遇到以下问题：/login路由中能正常读取req.session.user数据，但切换到/connect路由时，req.session.user显示为undefined，无法通过会话在路由间传递用户数据。

相关代码 #

后端代码 #

import express from 'express';
import session from 'express-session';
import userHelpers from './helpers/userHelpers.js';
import db from './config/connection.js';
import cors from 'cors';
import cookieParser from 'cookie-parser';
import morgan from 'morgan';
import MongoStore from 'connect-mongo';

const app = express();

// Middleware
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cors());
app.use(cookieParser());
app.use(morgan("dev"));

// Session configuration
app.use(session({
    secret: "Key",
    saveUninitialized: true,
    resave: false,
    store: new MongoStore({ mongoUrl: 'mongodb://127.0.0.1:27017/connect-app' }),
    cookie: { maxAge: 6000000 }
}));

// Connect to the database
db.connect((err) => {
    if (err) {
        console.log("Error in connection");
    } else {
        console.log("Connected to database");
    }
});

// Routes

app.post('/signup', async (req, res) => {
    const data = req.body;
    await userHelpers.signupUser(data).then((info) => {
        console.log("User created:", info);
        res.json({ valid: true });
    });
});

app.post('/login', (req, res) => {
    const data = req.body;
    userHelpers.loginUser(data).then((info) => {
        if (info) {
            req.session.user = { info };
            req.session.save();
            console.log("Login session :", req.session.user);
            res.json({ valid: true, userInfo: { info } });
        } else {
            console.log("User not found");
            res.json({ valid: false });
        }
    }).catch((err) => {
        console.log("Error:", err);
        res.json({ valid: false });
    });
});

app.get('/connect', async (req, res) => {
    console.log("Connect session:", req.session.user);
    if (req.session.user) {
        const user = req.session.user;
        console.log("USER:", user);
        return res.json({ valid: true, userInfo: user.info.email });
    } else {
        return res.json({ valid: false });
    }
});

// Start the server
app.listen(3001, () => {
    console.log('Server is running');
});

前端/login路由代码 #

const HandleClick = (e) => {
        e.preventDefault()
        axios.post('http://localhost:3001/login', { email, password }, {withCredentials:true, credentials: 'include'}).then((result) => {
            if(result.data.valid)
                navigate('/connect')
            else
                navigate('/login')
        }).catch((err) => {
            console.log(err)
        })
    }

前端/connect路由代码 #

useEffect(()=>{
        axios.get('http://localhost:3001/connect').then((response)=>{
            console.log(response.data)
        })
    })

问题排查与解决 #

1. 补全CORS凭证支持配置 #

后端默认的cors()中间件未开启允许携带凭证，导致前端请求无法传递session cookie。修改CORS配置：

app.use(cors({
    origin: 'http://localhost:3000', // 替换为你的前端实际域名
    credentials: true // 允许请求携带凭证
}));

2. 前端GET请求添加凭证配置 #

/connect路由的GET请求未设置withCredentials: true，导致session cookie无法发送到后端。修改前端代码：

useEffect(()=>{
        axios.get('http://localhost:3001/connect', { withCredentials: true }).then((response)=>{
            console.log(response.data)
        })
    }, []) // 添加空依赖数组，避免组件重复渲染时重复发送请求

3. 优化Session保存的异步处理 #

当前req.session.save()调用后直接返回响应，可能存在会话未完成持久化就跳转的情况。修改登录路由代码，确保会话保存完成后再返回：

app.post('/login', (req, res) => {
    const data = req.body;
    userHelpers.loginUser(data).then((info) => {
        if (info) {
            req.session.user = { info };
            req.session.save((err) => {
                if (err) {
                    console.log("Session save error:", err);
                    return res.json({ valid: false });
                }
                console.log("Login session :", req.session.user);
                res.json({ valid: true, userInfo: { info } });
            });
        } else {
            console.log("User not found");
            res.json({ valid: false });
        }
    }).catch((err) => {
        console.log("Error:", err);
        res.json({ valid: false });
    });
});

4. 可选：配置Session Cookie的SameSite属性 #

如果浏览器默认SameSite策略导致cookie跨域传递失败，可在session配置中显式设置：

app.use(session({
    secret: "Key",
    saveUninitialized: true,
    resave: false,
    store: new MongoStore({ mongoUrl: 'mongodb://127.0.0.1:27017/connect-app' }),
    cookie: { 
        maxAge: 6000000,
        sameSite: 'none', // 跨域场景下设置为none
        secure: process.env.NODE_ENV === 'production' // 生产环境需开启secure（仅HTTPS生效）
    }
}));

内容的提问来源于stack exchange，提问作者GayalMelappilly