React+Express配置CORS后仍出现跨域错误，刷新后消失

核心问题分析 #

首次重定向到前端首页后，获取用户信息的请求返回错误的Access-Control-Allow-Origin头（值为后端地址），刷新后恢复正常，本质是首次请求时后端未正确应用CORS配置，或会话状态未正确传递。

排查与解决步骤 #

1. 检查会话Cookie的SameSite属性
   跨域场景下，Passport生成的会话Cookie如果SameSite属性不是None，浏览器会在跨域请求中拒绝携带Cookie，导致后端认为用户未认证，可能返回重定向到后端登录页的响应（此时响应头的Access-Control-Allow-Origin为后端地址）。
   修改Express会话配置：

app.use(session({
  secret: '你的会话密钥',
  resave: false,
  saveUninitialized: false,
  cookie: {
    secure: process.env.NODE_ENV === 'production', // 生产环境必须开启HTTPS并设为true
    sameSite: process.env.NODE_ENV === 'production' ? 'none' : 'lax', // 跨域场景设为None
    maxAge: 24 * 60 * 60 * 1000 // Cookie有效期
  }
}));

2. 动态验证CORS Origin
   硬编码Origin可能存在边界场景匹配问题，改用动态验证函数确保正确返回允许的Origin：

app.use(cors({
  origin: (origin, callback) => {
    const allowedOrigins = ['http://localhost:5173'];
    // 允许无Origin的请求（如Postman测试）
    if (!origin || allowedOrigins.includes(origin)) {
      callback(null, true);
    } else {
      callback(new Error('CORS不允许该来源'));
    }
  },
  methods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'],
  credentials: true
}));

3. 确保Passport回调路由正确建立会话
   谷歌登录回调后，必须确保会话已正确保存再重定向到前端，避免前端首次请求时会话未生效：

app.get('/auth/google/callback',
  passport.authenticate('google', { failureRedirect: '/login' }),
  (req, res) => {
    // 确认req.user存在后再重定向
    if (req.user) {
      res.redirect('http://localhost:5173');
    } else {
      res.status(401).redirect('http://localhost:5173/login');
    }
  }
);

4. 禁用用户信息接口的缓存
   浏览器可能缓存了未认证状态的响应头，在获取用户信息的接口中添加缓存控制头：

app.get('/api/current-user', (req, res) => {
  res.set('Cache-Control', 'no-cache, no-store, must-revalidate');
  if (req.isAuthenticated()) {
    res.json(req.user);
  } else {
    res.status(401).json({ message: '未认证' });
  }
});

5. 再次确认中间件加载顺序
   确保中间件加载顺序严格遵循：

// 1. CORS中间件
app.use(cors(...));
// 2. 解析请求体
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
// 3. 会话中间件
app.use(session(...));
// 4. Passport初始化
app.use(passport.initialize());
app.use(passport.session());
// 5. 业务路由
app.use('/api', yourRoutes);

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