Na tej stronie opisujemy, jak wdrożyć funkcje związane z logowaniem się i wylogowywaniem użytkowników za pomocą Google One Tap.
Użytkownicy logują się automatycznie
Google One Tap obsługuje logowanie automatyczne, co ułatwia korzystanie z witryny, ponieważ użytkownicy nie muszą ręcznie wykonywać czynności, które muszą wykonać po powrocie do Twojej witryny. Użytkownicy nie muszą pamiętać, które konto Google wybrali podczas ostatniej wizyty, co zmniejsza ryzyko utworzenia na platformie niepotrzebnych zduplikowanych kont.
Logowanie automatyczne ma uzupełniać okna Zaloguj się przez Google i 1 kliknięcie. Jest ono przeznaczone do użytku w całej witrynie w przypadku ręcznej rejestracji lub przełączania kont dopiero po tym, jak użytkownik się z niej wyloguje.
Logowanie automatyczne wymaga spełnienia tych warunków:
- użytkownicy muszą najpierw zalogować się na swoje konta Google;
- poprzednio wyraził zgodę na udostępnianie profilu swojego konta Twojej aplikacji;
- podczas korzystania z FedCM w ciągu ostatnich 10 minut podjęto tylko próbę logowania jednokrotnego. Jeśli w tym oknie wystąpiły kolejne próby logowania, wyświetlane jest jedno dotknięcie.
W przypadku stron, na których włączone jest logowanie automatyczne, a te warunki są spełnione, dane uwierzytelniające tokena identyfikatora użytkownika są zwracane automatycznie bez udziału użytkownika. Jeśli te warunki nie zostaną spełnione, a na stronie jest włączone logowanie automatyczne, użytkownik będzie domyślnie wybierał opcję logowania lub wyrażenia zgody jednym dotknięciem. Jeśli użytkownik korzysta z wielu kont Google i odwiedza Twoją witrynę, musi najpierw zalogować się na jedno konto Google i wyrazić na nie zgodę.
Wskaźnik sukcesu logowania automatycznego możesz mierzyć za pomocą wartości auto w polu select_by zwróconego obiektu danych logowania.
Aby włączyć logowanie automatyczne, dodaj do kodu kod data-auto_select="true", jak pokazano w tym fragmencie:
<div id="g_id_onload"
data-client_id="YOUR_GOOGLE_CLIENT_ID"
data-login_uri="https://your.domain/your_login_endpoint"
data-auto_select="true">
</div>
Wyloguj się
Gdy użytkownik wyloguje się z Twojej witryny, może zostać przekierowany na stronę, na której automatycznie wyświetli się prośba o dotknięcie Google One Tap. W tej konfiguracji automatyczny wybór musi być zabroniony. W przeciwnym razie użytkownik jest automatycznie logowany ponownie, co prowadzi do niepokojącego stanu UX.
Korzystanie z FedCM
Aby zapewnić użytkownikom lepsze wrażenia, między każdą próbą logowania automatycznego obowiązuje 10-minutowy okres bez powiadomień. W tym okresie wyświetla się jedno dotknięcie.
Bez FedCM
Aby uniemożliwić automatyczne wybieranie po wylogowaniu się użytkownika, dodaj nazwę klasy g_id_signout do wszystkich linków i przycisków wylogowania. Zobacz ten fragment kodu:
<div class="g_id_signout">Sign Out</div>
Aby się wylogować, możesz też użyć tego fragmentu kodu JavaScript:
const button = document.getElementById('signout_button');
button.onclick = () => {
google.accounts.id.disableAutoSelect();
}
W rezultacie stan wylogowania jest rejestrowany za pomocą pliku cookie w Twojej domenie, co pozwala uniknąć nieoczekiwanej ścieżki użytkownika.
Stan wylogowania jest przechowywany w pliku cookie g_state w Twojej domenie. Jeśli masz usługę, która monitoruje wszystkie pliki cookie używane w Twojej domenie, musisz powiadomić ją o tym pliku.
Jeśli nie chcesz wczytywać biblioteki klienta na stronach wyświetlanych po zalogowaniu, użyj tych rozwiązań, aby uniknąć wystąpienia pętli nieprzejściowej po wylogowaniu:
- Przy wylogowaniu przekieruj użytkowników na stronę (np.
https://example.com/logged_out), na której nie wyświetla się jedno kliknięcie lub na której automatyczne logowanie jest zawsze wyłączone. - Przy wylogowaniu dodaj parametr do adresu URL. Na przykład:
logged_out=1. Jeśli renderujesz stronę jednym dotknięciem przez JavaScript API, sprawdź ten parametr adresu URL i wyłącz automatyczne logowanie, jeśli jest dostępne.
Kluczowe ścieżki użytkowników
Strona automatycznego logowania.
Korzystanie z FedCM
Jeśli użytkownicy nie klikną X, aby anulować subskrypcję w ciągu 5 sekund, token identyfikatora zostanie udostępniony Twojej witrynie.
Bez FedCM
Jeśli użytkownik nie kliknie przycisku Anuluj w ciągu 5 sekund, token identyfikatora zostanie udostępniony Twojej witrynie.
Gdy logowanie zostanie anulowane (w zależności od liczby aktywnych sesji Google), wyświetli się strona wyboru konta lub strona powracającego użytkownika.
Wiele sesji Google
Korzystanie z FedCM
Bez FedCM
Pojedyncze sesje Google
Korzystanie z FedCM
Bez FedCM
