Google 登录实施

Question

我的产品基于 React/FastAPI 技术堆栈。简单的

client <-> api

架构。

React 应用程序要求输入用户名/密码，然后根据 api 进行身份验证。如果一切正常，API 将返回 JWT 令牌。

现在，我想做的是添加社交登录，所以我从 Google 开始。不幸的是，我没有找到当前在这种架构中集成 Google Sign-in 的最佳实践，全是 JS，仅此而已。因此，在深入研究了一页又一页的文档之后，这就是我采取的方法：

• 我创建了 2 个 api 端点

  /google/login

  和

  /google/callback

• 第一个端点调用google生成SSO url
• 第二个端点由 Google 回调，以便我可以验证请求
• 如果您直接使用 API 尝试此流程，它就像一个魅力。

但我必须通过我的 React 网站使用它。这就是我所做的：

• 我的网站上有一个按钮（经典的 Google 登录按钮），单击该按钮时，会调用我的 /google/login api 端点并获取 SSO url
• React 客户端应用程序将用户重定向到 SSO URL
• 用户使用 google 登录
• 作为 Google 上的回调 url，我在 React 应用程序上设置了一条路由，因此在调用时，它只获取有效负载和标头，并将它们转发到我的 /google/callback api 端点，该端点会验证请求以及是否一切正常使用有效的 JWT 回答

此流程在某种程度上有效，但我在 Brave 方面遇到了一些问题，例如，Google 登录后不会发生重定向（实际上只有重新加载页面时才会发生）。

所以我想知道，这是实现 Google Oauth2 流程的正确方法吗？

Answer 1

由于隐私和安全设置，某些浏览器（例如 Brave）可能会阻止 OAuth2 登录后的自动重定向。此行为需要在您的 React 应用程序中进行处理。 不要依赖自动重定向，而是考虑使用一种机制，让用户在成功登录 Google OAuth 页面后单击按钮或链接来手动继续。