how to call getBasicProfile() of google to google signin on only button click?

javascript jquery google-api google-signin

11,368

Solution 1

Best solution is to render sign-in button only when user is not signed in.

<html>
<head>
   <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
</head>
<body>
  <script>
    function onSignIn(googleUser) {
      var profile = googleUser.getBasicProfile();
      var user_name = profile.getName();
      alert(user_name);
    }

    function onLoad() {
      gapi.load('auth2,signin2', function() {
        var auth2 = gapi.auth2.init();
        auth2.then(function() {
          // Current values
          var isSignedIn = auth2.isSignedIn.get();
          var currentUser = auth2.currentUser.get();

          if (!isSignedIn) {
            // Rendering g-signin2 button.
            gapi.signin2.render('google-signin-button', {
              'onsuccess': 'onSignIn'  
            });
          }
        });
      });
    }
  </script>

  <div id="google-signin-button"></div>

  <script src="https://apis.google.com/js/platform.js?onload=onLoad" async defer></script>
</body>
</html>

Solution 2

I done it by declaring global js variable as false

var isFirstGoogle = 0;

Then to check this variable

if(isFirstGoogle)
{
//wont enter here first time
}
isFirstGoogle = 1;

So next time when I click on button the above method will be called as now isFirstGoogle = 1;

Hope this help!! It's a temporary thing I know but it's working for me.

11,368

Author by

Learner

Updated on June 09, 2022

Comments

Learner almost 2 years

i have take google signin in my website :

<script src="https://apis.google.com/js/platform.js" async defer></script>

<script>
    function onSignIn(googleUser) {
      var profile = googleUser.getBasicProfile();
      //console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
      //console.log('Image URL: ' + profile.getImageUrl());
      //console.log('Name: ' + profile.getName());
      //console.log('Email: ' + profile.getEmail());
      var user_uname = profile.getName();
      var user_email = profile.getEmail();
      alert(user_uname);
    }

</script>

and here is a button to login google:

<div class="g-signin2" data-onsuccess="onSignIn"></div>

i want to give user google signin but the problem is whenever page is load onSignIn() function is called automatically. i want it only on button click. can anybody help me?