METAタグを使用せずにデフォルトのGoogleサインインボタンを表示するにはどうすればよいですか？

次の資料は、次のコードを使用して https://developers.google.com/identity/sign-in/web/sign-in METAタグを使用せずにデフォルトのGoogleサインインボタンを表示するにはどうすればよいですか？

...]ボタンでデフォルトのGoogleの記号を表示する方法を示し、サインインボタンがうまく表示されます。内...

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="google-signin-client_id" content="MYCLIENTID.apps.googleusercontent.com"> 
</head> 
<body> 
    <div class="g-signin2" data-onsuccess="onSignIn"></div> 

    <script src="https://apis.google.com/js/platform.js" async defer 
      onload="this.onload = handleClientLoad()" 
      onreadystatechange="if (this.readyState === 'complete') this.onload()"> 
    </script> 
</body> 
</html>

結果

物品はまた、CLIENT_IDはgapi.auth2.init（）メソッドで指定することができる言及しています。 これは、CLIENT_IDがこのように渡された場合、メタタグが必要ないと仮定します。次のコードで

そう ...

<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body> 
    <div class="g-signin2" data-onsuccess="onSignIn"></div> 

    <script type="text/javascript"> 
     function handleClientLoad() { 
      gapi.load('client:auth2', initClient); 
     } 

     function initClient() { 
      // Client ID and API key from the Developer Console 
      var CLIENT_ID = 'MY_CLIENT_ID.apps.googleusercontent.com'; 

      // Array of API discovery doc URLs for APIs used by the quickstart 
      var DISCOVERY_DOCS = ["https://www.googleapis.com/discovery/v1/apis/calendar/v3/rest"]; 

      // Authorization scopes required by the API; multiple scopes can be 
      // included, separated by spaces. 
      var SCOPES = "https://www.googleapis.com/auth/calendar"; 

      gapi.client.init({ 
       apiKey: 'MY_API_KEY', 
       discoveryDocs: DISCOVERY_DOCS, 
       clientId: CLIENT_ID, 
       scope: SCOPES 
      }).then(function() { 
      }); 
     } 

    </script> 
    <script src="https://apis.google.com/js/platform.js" async defer 
      onload="this.onload = handleClientLoad()" 
      onreadystatechange="if (this.readyState === 'complete') this.onload()"> 
    </script> 
</body> 
</html>

ボタンは表示されません。

ヘッダーにCLIENT_IDのメタタグを使用せずにデフォルトのGoogleログインボタンを表示するにはどうすればよいですか？また、CLIENT_IDとAPI_KEYをWebページに公開するのはセキュリティ上のリスクですか？私はOauthの制限とAPIのキーの制限は、リスクを軽減すると思いますか？

出典

2017-09-21 John Livermore

代わりにOAuthメソッドを使用することをお勧めします。ジャストボタンで、Googleのログインの画像を取得：

をしてから、このCalendar Quickstartに見られるようにOAuthを実装します。

プライベートなウェブには何も公開しないようにしてください。おそらく、そのサインインサンプルはテスト目的のみのものです。

としてはhereを述べた：

私たちはあなたのアプリケーションがページ上の他のリソースへの認証コードを公開しないように、アプリの認証エンドポイントを設計することをお勧めします。

出典

2017-09-22 06:01:21 noogui

Hello noogui [ここ]（https://www.w3schools.com/tags/tag_meta.asp）によると、メタタグは現在のウェブページに関する情報を提供するために使用されています。しかし、なぜボタンが表示されなければならないのですか？私は詳細を知りたいです。説明していただけますか？ – learner

METAタグを使用せずにデフォルトのGoogleサインインボタンを表示するにはどうすればよいですか？

答えて

関連する問題