在过去多次失败之后，我实际上不久前就在研究这个问题。试图找到一个适用于 React 的解决方案确实是一件令人头疼的事情。然而，我已经成功地在 React 前端轻松设置了 google 登录https://www.npmjs.com/package/react-google-login https://www.npmjs.com/package/react-google-login。这应该是您需要采取的第一步。
之后，您需要使用 django_allauth 在 Django 后端设置社交登录。基本上，这个想法是，一旦用户通过谷歌登录，或者更准确地说，点击前端的“使用谷歌登录”按钮，就会从谷歌检索谷歌 access_token 并与一些其他数据一起保存在本地存储中。这里只有 access_token 感兴趣。因此，您需要获取此 access_token 并通过您将设置的视图的 Rest API 将其发送到 Django 后端。这将获取保存在社交帐户下数据库中的谷歌用户数据，最终将它们登录到应用程序中。从那时起，一切都应该按照您使用电子邮件和用户名的正常登录继续。也就是说，如果使用 JWT，将从后端返回一个 jwt 令牌，您希望能够将其保存在本地存储中。在我的 React 应用程序中，我根据此令牌进行身份验证，因此只要本地存储中有该令牌，用户就会登录。
Pratik Singh Chauhan 在他的第 1 部分教程中很好地解释了这一点 ->https://medium.com/@pratique/social-login-with-react-and-django-i-c380fe8982e2 https://medium.com/@pratique/social-login-with-react-and-django-i-c380fe8982e2和第 2 部分在这里 ->https://medium.com/@pratique/social-login-with-react-and-django-ii-39b8aa20cd27 https://medium.com/@pratique/social-login-with-react-and-django-ii-39b8aa20cd27
UPDATE: 2022 年 6 月
由于 Google 现在正在转向 (GIS) Google Identity Services 登录 SDK，因此这种方法虽然有效，但现已弃用。
这是一个很好的链接，可以帮助您使用新的 google GIS 设置反应登录。
https://github.com/MomenSherif/react-oauth/issues/12#issuecomment-1131408898 https://github.com/MomenSherif/react-oauth/issues/12#issuecomment-1131408898
根据您的工作流程，您可以使用两种方法：隐式方法或授权方法。为了维持与上述代码实现的类似工作流程，隐式工作流程可以为您提供 access_token 和 refresh_token，并将它们发送到后端 api。
这是另一个包含两个工作流程示例代码的链接。
https://react-oauth.vercel.app/ https://react-oauth.vercel.app/
请注意，您将需要使用@react-oauth/谷歌在您的代码中配置 Google 工作流程。
参考这个：
https://reactjsexample.com/google-oauth2-using-the-new-google-identity-services-sdk-for-react/ https://reactjsexample.com/google-oauth2-using-the-new-google-identity-services-sdk-for-react/
