在生产环境的MERN全栈中,Google登录身份验证出现问题。
我正在为一个项目实现认证系统,在实现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"
});