web-dev-qa-db-ja.com

HTML PHP google single sign on signout will throw an Cannot read property 'getAuthInstance' of undefined "

https://developers.google.com/identity/sign-in/web/sign-in に記載されている手順に従って、Googleシングルサインオンを作成しました

サインインは魅力のように機能しますが、リンクの記事に従ってサインアウトを統合しようとすると

コンソールに次のJavaScriptエラーが表示されます

Uncaught TypeError:undefinedのプロパティ 'getAuthInstance'を読み取れません

そして、私のサインアウト関数は次のようになります

<script>
    function signOut() {
       var auth2 = gapi.auth2.getAuthInstance();
       auth2.signOut().then(function () {
          console.log('User signed out.');
       });
    }
</script>

そして私のサインインは次のようになります

function onSignIn(googleUser) {

    var profile = googleUser.getBasicProfile();
    console.log('ID: ' + profile.getId()); 
    console.log('Name: ' + profile.getName());
    console.log('Image URL: ' + profile.getImageUrl());
    console.log('Email: ' + profile.getEmail());

}
19
manu g

サインインとサインアウトは同じページで使用されますか? Div g-signin2は、gapi.auth2を読み込んで初期化するため、同じページにある限り機能します。

SignOutが別のページにある場合は、gapi.auth2ライブラリを手動でロードして初期化する必要があります。

完全な例(YOUR_CLIENT_IDを実際のclient_idに置き換える必要があります):

<html>
<head>
   <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
</head>
<body>
  <script>
    function signOut() {
      var auth2 = gapi.auth2.getAuthInstance();
      auth2.signOut().then(function () {
        console.log('User signed out.');
      });
    }

    function onLoad() {
      gapi.load('auth2', function() {
        gapi.auth2.init();
      });
    }
  </script>
  <a href="#" onclick="signOut();">Sign out</a>

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

チェック: https://developers.google.com/identity/sign-in/web/reference#gapiauth2getauthinstance

特にこの部分:

gapi.auth2.getAuthInstance()

GoogleAuthオブジェクトを返します。このメソッドを呼び出す前に、gapi.auth2.init()を使用してGoogleAuthオブジェクトを初期化する必要があります。

私にとっての問題は、最初にgapi.auth2.init()を呼び出さなかったことです

3
Leon Wang

私は同じ問題を抱えていて、解決策を見つけたようで、これは事実だと思います。

そのようなメソッド呼び出しが、以下のように、スクリプトの下部にあるはずです。

gapi.load("client", initAuth);

これは次のように変更する必要があります

gapi.load("client:auth2", initAuth);

これはうまくいくはずです(少なくとも私にとってはうまくいきました)。

最も簡単な方法は、?onload = onLoadを追加して、APIスクリプトが

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

<script>
    function signOut() {
      var auth2 = gapi.auth2.getAuthInstance();
      auth2.signOut().then(function () {
        console.log('User signed out.');
      });
    }

    function onLoad() {
      gapi.load('auth2', function() {
        gapi.auth2.init();
      });
    }
  </script>
0
seng