检查回访用户.Google登录会话(JavaScript)

Check for returning users. Google sign-in session (JavaScript)

本文关键字：会话 JavaScript 登录 Google 用户 检查      更新时间：2023-09-26

我正在尝试使用他们的新API实现谷歌登录:https://developers.google.com/identity/sign-in/web/
登录、退出和显示用户数据工作正常。
我有麻烦，使我的网页记住，当刷新页面或离开网站，回来时，用户已登录。我想显示(例如在控制台中)用户数据、隐藏按钮等。
似乎我必须使用这里解释的侦听器，并标记为已解决，但仍然不能使它工作。
这是我目前的工作:

<!DOCTYPE html>
<html>
<head>
  <script src="https://apis.google.com/js/platform.js" async defer></script>  
  <meta name="google-signin-client_id" content="***.apps.googleusercontent.com">
  <script type="text/javascript">    
  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('Name: ' + profile.getName());
    console.log('Image URL: ' + profile.getImageUrl());
    console.log('Email: ' + profile.getEmail());
  }
  function signOut() {
    var auth2 = gapi.auth2.getAuthInstance();      
      auth2.disconnect().then(function () {        
      console.log('User signed out.');
    });
  }
  </script>
</head>
<body>
  <div id="but" class="g-signin2" data-onsuccess="onSignIn"></div>
  <a href="#" onclick="signOut();">Sign out</a>
</body>
</html>

因为我在这里已经有一段时间了，我真的很欣赏一个完整的工作示例。谢谢!

看起来您在加载platform.js时缺少回调，并且没有初始化您的客户端。将include更改为:

  <script src="https://apis.google.com/js/client:platform.js?onload=startApp" async defer></script>
然后你可以在startApp中执行任何初始化后的步骤，例如: 
function startApp() {
  gapi.load('auth2', function() {
    gapi.client.load('plus','v1').then(function() {
      gapi.signin2.render('signin-button', {
          scope: 'profile',
          fetch_basic_profile: false });
      gapi.auth2.init({fetch_basic_profile: false,
          scope:'profile'}).then(
            function (){
              console.log('init');
              auth2 = gapi.auth2.getAuthInstance();
              auth2.isSignedIn.listen( function() {
                  console.log(auth2.currentUser.get());
                });
              auth2.then(function(resp){
                  console.log(auth2.currentUser.get());
                });
            });
    });
  });
}

我在这里放了一个演示

相关文章：