在生产环境的MERN全栈中,Google登录身份验证出现问题。

前端开发 2026-07-07

我正在为一个项目实现认证系统,在实现Google OAuth功能时。前端调用Google授权提供方以获取code,随后调用Google路由,即 /api/auth/google,这里的任务是获取票据并验证票据,随后生成带有httpOnly=true、secure=true、sameSite="none"、expiresAt的 refreshToken和 accessToken。使用普通的邮箱和密码登录时,浏览器会保存Cookies以实现持久连接,工作正常。但在使用 flow: "auth-code" 的Google OAuth(通过useGoogleLogin)时,浏览器不会保存Cookies,并会显示警告 “由于用户偏好,通过Set-Cookie头设置Cookie的尝试被阻止。” 要让它工作,需要启用第三方Cookies。但问题在于如果重启系统,用户的登录就会中断,需要再次登录。我在生产环境遇到这个问题,在本地环境没有遇到。我使用Vercel托管服务端和客户端。请帮助我在不启用第三方Cookie的前提下实现持久登录。

前端: https://pin-vault-frontend.vercel.app
API: https://pin-vault-server.vercel.app
GitHub: https://github.com/ShounakMahata18/Pin-Vault

解决方案

你遇到的是浏览器隐私规则的问题,而不是Google OAuth的漏洞。

在你的项目中,pin-vault-frontend.vercel.app和 pin-vault-server.vercel.app是跨站的。

在生产环境中,你的Google OAuth回调流程被视为第三方上下文,因此除非启用第三方Cookies,否则Set-Cookie头会被阻止。这就是为什么邮箱/密码登录是第一方上下文、可以持久化,而Google登录却无法持久化的原因。

我建议你修复当前流程。 将会话创建移到前端触发的请求 更改你的流程: 步骤1(OAuth回调)

后端不应设置cookies。

相反:

res.redirect("https://pin-vault-frontend.vercel.app/auth/success?code=4/0AfJohXabc123");

步骤2(前端)

调用后端:

POST https://pin-vault-server.vercel.app/api/auth/exchange

发送代码。

步骤3(后端)

现在设置cookies:

res.cookie("accessToken", token, {
  httpOnly: true,
  secure: true,
  sameSite: "lax"
});
站内所有文章版权归属LeftHeroAI导航站,无授权禁止任何主体转载、抄袭、复制内容,亦不得私自架设镜像站点。一经侵权,本站将通过法律途径追责。

相关文章