首页 > 解决方案 > 在 ReactJS 中实现简单的 Google oAuth

问题描述

我有一个像这样设置的迷你香草 JS 应用程序:

<!DOCTYPE html>
<html lang="en">
  <head>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <meta
      name="google-signin-client_id"
      content="{{client_id}}" /> <!--Here goes my actual WORKING google client id-->
    />
  </head>
  <body>
    <div class="g-signin2" data-onsuccess="onSignIn"></div>
 
    <button onclick="signOut()">Sign Out</button>
    <script>
      function onSignIn(googleUser) {
        const profile = googleUser.getBasicProfile();
        console.log("ID: " + profile.getId()); // Do not send to your backend! Use an ID token instead.
        console.log("Name: " + profile.getName());
        console.log("Image URL: " + profile.getImageUrl());
        console.log("Email: " + profile.getEmail()); // This is null if the 'email' scope is not present.
        }

      function signOut() {
        var auth2 = gapi.auth2.getAuthInstance();
        auth2.signOut().then(function () {
          console.log("User signed out.");
        });
      }

    </script>
  </body>
</html>

我在哪里登录用户,然后我可以使用 Google 将其注销。当我尝试将其转移到 React 项目时,我遇到了一些问题:

标签: javascriptnode.jsreactjsoauth-2.0google-oauth

解决方案


我认为您可以使用此库https://www.npmjs.com/package/react-google-login。或者,也许您可​​以阅读该 repo 的 github 以了解如何获取 google oauth 以响应应用程序


推荐阅读