Node.js+Express+React集成Google登录遇TypeError问题求助

我是Node.js和Express服务器的新手，正在开发一款支持Gmail登录的Web应用，前端采用React框架。但目前一直报错：TypeError: Cannot set properties of undefined (setting 'user')。此前我使用类似方案开发无React的简易登录登出前端时可正常运行，然而当前脚本持续抛出该错误。

相关代码 #

passport.serializeUser((user, cb) => {
  process.nextTick(() => {
    return cb(null, { id: user?.id, email: user?.email, googleId: user?.googleId });
  });
});

passport.deserializeUser(async (user, cb) => {
  process.nextTick(async () => {
    try {
      const dbUser = await getMemberById(user?.id);
      if (dbUser) {
        dbUser.email = user?.email;
        dbUser.googleId = user?.googleId;
      }
      cb(null, dbUser);
    } catch (err) {
      cb(err);
    }
  });
});

passport.use(new GoogleStrategy({
  clientID: process.env.GOOGLE_CLIENT_ID,
  clientSecret: process.env.GOOGLE_CLIENT_SECRET,
  callbackURL: 'http://localhost:3002/auth/google/callback'
}, async (token, tokenSecret, profile, done) => {
  try {
    console.log('Google profile:', profile);
    let user = await getMemberByName(profile.id);
    if (!user) {
      console.log("User not found, creating new user");
      user = await createMember(profile.emails[0].value, profile.id);
      console.log("New user created:", user);
    }
    user.email = profile.emails?.[0]?.value || null; // Add email to user object if it exists
    user.googleId = profile.id; // Add googleId to user object
    console.log('User object before serialization:', user);
    return done(null, user);
  } catch (error) {
    console.log("Error in authentication process:", error);
    return done(error, null);
  }
}));

解决思路 #

1. 排查user对象未定义的核心场景

错误提示是设置user属性时目标对象未定义，先聚焦以下两个方向：

• Google策略中的user变量：如果getMemberByName(profile.id)无结果，且createMember执行失败（比如数据库插入出错），会导致user为undefined，后续执行user.email = ...会触发类似错误；若你的错误明确是setting 'user'，需检查其他路由/中间件中是否有xxx.user = ...的逻辑，确认xxx是否被正确定义。
• 强制校验createMember返回值：确保该函数在创建用户成功后返回完整的用户对象，而非仅返回插入ID或undefined。比如SQL插入后，需通过查询返回新创建的完整记录。

2. 修复Google策略中的防御性代码

在给user赋值前增加存在性检查，避免操作undefined：

// 修改GoogleStrategy中的逻辑
if (!user) {
  console.log("User not found, creating new user");
  // 先处理profile.emails为空的情况，避免访问undefined属性
  const userEmail = profile.emails?.[0]?.value || '';
  user = await createMember(userEmail, profile.id);
  // 校验用户创建结果
  if (!user) {
    return done(new Error('Failed to create user'), null);
  }
  console.log("New user created:", user);
}
// 仅当user存在时才赋值
user.email = profile.emails?.[0]?.value || null;
user.googleId = profile.id;

3. 修正deserializeUser的异步逻辑

process.nextTick包裹异步函数属于冗余写法，可能导致回调时机异常，简化为：

passport.deserializeUser(async (user, cb) => {
  try {
    const dbUser = await getMemberById(user?.id);
    if (dbUser) {
      dbUser.email = user?.email;
      dbUser.googleId = user?.googleId;
    }
    cb(null, dbUser);
  } catch (err) {
    cb(err);
  }
});

4. 解决跨域会话问题（React前端专属）

因为前端React和后端Express跨域运行，需确保会话能正确保持：

• 后端配置cors中间件：

  const cors = require('cors');
  app.use(cors({
    origin: 'http://localhost:3000', // 替换为你的React前端地址
    credentials: true
  }));
  

• 前端请求携带凭证：使用axios时设置withCredentials: true，使用fetch时设置credentials: 'include'。
• 调整express-session的cookie配置（开发环境）：

  app.use(session({
    secret: 'your-custom-secret-key',
    resave: false,
    saveUninitialized: false,
    cookie: {
      secure: false, // 开发环境用HTTP设为false；生产环境HTTPS设为true
      sameSite: 'lax'
    }
  }));
  

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