自動ログインとログアウト

コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。

このページでは、ユーザーが Google One Tap でログインまたはログアウトする方法に関連する機能を実装する方法について説明します。

ユーザーを自動的にログインさせる

Google One タップは自動ログインに対応しているため、サイトに戻ったときにユーザーが手動で行う必要がなくなるため、スムーズなユーザー エクスペリエンス（UX）を実現できます。ユーザーは、前回の訪問時に選択した Google アカウントを覚えておく必要がないため、プラットフォームで不要なアカウントが作成される可能性が低くなります。

自動ログインは、[Google でログイン] ボタンとワンタップ ダイアログを補完するものです。このポリシーは、サイト全体で使用するように設計されており、ユーザーがサイトで初めてログアウトした後にのみ手動登録やアカウントの切り替えが行われます。

自動ログインを行うには、次の条件が必要です。

  • ユーザーはまず Google アカウントにログインする必要があります。
  • アカウントのプロフィールをアプリと共有することに以前同意しています。

自動ログインが有効で、これらの条件が満たされた場合、ユーザーの操作なしで訪問者 ID トークンの認証情報が自動的に返されます。上記の条件が満たされず、ページで自動ログインが有効になっていても、ユーザーはデフォルトでログインや同意のワンタップ フローになります。ユーザーが複数の Google アカウントを持っており、サイトにアクセスする場合、最初に 1 つの Google アカウントにログインし、そのアカウントの同意を得る必要があります。

自動ログインの成功率は、返された認証情報オブジェクトの select_by フィールドの auto 値を使用して測定できます。

自動ログインを有効にするには、次のスニペットに示すように、data-auto_select="true" をコードに追加します。

<div id="g_id_onload"
     data-client_id="YOUR_GOOGLE_CLIENT_ID"
     data-auto_select="true"
     data-login_uri="https://your.domain/your_login_endpoint">
</div>

ログアウト

ユーザーがウェブサイトからログアウトすると、Google One タップ プロンプトが自動的に表示されるページにユーザーを誘導できます。この設定では、自動選択を禁止する必要があります。そうしないと、ユーザーは自動的に再度ログインするため、デッドループの UX が発生します。

ユーザーのログアウト後に自動選択を禁止するには、すべてのログアウト リンクとボタンにクラス名 g_id_signout を追加します。次のコード スニペットをご覧ください。

<div class="g_id_signout">Sign Out</div>

次の JavaScript コード スニペットはログアウトにも使用できます。

  const button = document.getElementById(‘signout_button’);
    button.onclick = () => {
      google.accounts.id.disableAutoSelect();
    }

その結果、ログアウト ステータスは、ドメインの Cookie を介して記録されるため、デッドループの UX を回避できます。

ログアウト ステータスは、ドメインの g_state Cookie に保存されます。ドメインで使用されているすべての Cookie をモニタリングするサービスがある場合は、その Cookie を通知する必要があります。

ログイン後のページにクライアント ライブラリを読み込まない場合は、以下のような簡単なソリューションを使用して、ログアウト時のデッドループの UX を防ぐことができます。

  • ログアウトすると、ワンタップが表示されない、または自動ログインが常に無効になっているページ（https://example.com/logged_out など）にユーザーをリダイレクトします。
  • ログアウトしたら、URL にパラメータを追加します。例: logged_out=1。One Tap by JavaScript API をレンダリングする場合は、その URL パラメータを確認し、存在する場合は自動ログインを無効にします。

主なユーザー ジャーニー

  1. 自動ログインページ。

    自動ログインのポップアップ

  2. ユーザーが 5 秒以内に [キャンセル] ボタンをクリックしなかった場合は、ID トークンがウェブサイトと共有されます。

  3. ログインがキャンセルされた場合は、アクティブな Google セッションの数に基づいて、アカウント選択ツールのページまたはリピーターのページのいずれかが表示されます。

    • 複数の Google セッション

      アカウント選択ツールのページ

    • 単一の Google セッション

      ワンタップのリピーター ページ