Migracja z logowania przez Google

Ten przewodnik pomoże Ci zrozumieć niezbędne zmiany i kroki, przenieść biblioteki JavaScript z wcześniejszego logowania przez Google biblioteki platformy do nowszej biblioteki usług tożsamości Google dla authentication.

Jeśli Twój klient używa biblioteki klienta interfejsu API Google do obsługi języka JavaScript lub innych starszych bibliotek do autoryzacji: Migracja do Google Identity , aby dowiedzieć się więcej.

Uwierzytelnianie i autoryzacja

Uwierzytelnianie określa, kim jest dana osoba. Jest to tzw. rejestracji użytkowników lub logowania się. Autoryzacja to proces przyznawania lub odrzucanie dostępu do danych lub zasobów. Na przykład aplikacja wysyła żądania dotyczące zgody użytkownika na dostęp do jego Dysku Google.

Podobnie jak w przypadku biblioteki platformy logowania Google, nowa Tożsamość Google Biblioteka usług jest stworzona z myślą o obsłudze uwierzytelniania i autoryzacji

Nowsza biblioteka rozdziela te 2 procesy, aby zmniejszyć złożoność. integracji kont Google z aplikacją.

Jeśli Twój przypadek użycia dotyczy tylko uwierzytelniania, czytaj dalej tę stronę.

Jeśli Twój przypadek użycia obejmuje autoryzację, przeczytaj artykuł Jak działa autoryzacja użytkownika. i Migrate to Google Identity Services (Migracja do usług tożsamości Google), aby upewnić się, że aplikacja jest za pomocą nowych i ulepszonych interfejsów API.

Co się zmieniło

Użytkownicy mają dostęp do nowej biblioteki usług tożsamości Google i łatwiejsza w obsłudze. Najważniejsze funkcje:

• Nowe, bezproblemowe procesy logowania się jednym dotknięciem i automatycznego logowania z mniejszą liczbą użytkowników kroki,
• odświeżony przycisk logowania z personalizacją
• spójne budowanie marki i jednolite zasady logowania w internecie zrozumienia i zaufania,
• szybko przejść do treści, Użytkownicy mogą się zarejestrować i zalogować z dowolnego miejsca w witrynie bez konieczności wchodzenia na stronę logowania lub konta.

W przypadku deweloperów koncentrujemy się na uproszczeniu, poprawie bezpieczeństwa jak najszybciej. Oto niektóre z tych ulepszeń:

• Opcja dodania loginu użytkownika do treści statycznej witryny HTML
• oddzielenie uwierzytelniania logowania od autoryzacji i udostępniania danych użytkowników, złożoność integracji OAuth 2.0 nie jest już potrzebna do logowania użytkowników do witryny,
• tryby wyskakującego i przekierowania są nadal obsługiwane, ale Infrastruktura w wersji 2.0 przekierowuje teraz do punktu końcowego logowania serwera backendu,
• konsolidacja funkcji z wcześniejszych wersji Tożsamości Google i biblioteki JavaScript interfejsów API Google w jedną nową bibliotekę,
• dla odpowiedzi na logowanie, możesz teraz zdecydować, czy chcesz użyć atrybutu Promise i pośrednie za pomocą funkcji stylu pobierania ma zostały usunięte dla uproszczenia.

Przykład migracji logowania

Jeśli przeprowadzasz migrację z istniejącego przycisku logowania przez Google i tylko zainteresowanym zalogowaniem użytkowników do witryny, najprostszą zmianą jest aby zastosować nowy, spersonalizowany przycisk. Można to zrobić, zamieniając Biblioteki JavaScript i aktualizowanie bazy kodu pod kątem korzystania z nowego obiektu logowania.

Biblioteki i konfiguracja

Wcześniejsza biblioteka platformy logowania przez Google: apis.google.com/js/platform.js, i biblioteka klienta interfejsów API Google dla JavaScript: gapi.client nie są nie są wymagane do uwierzytelniania i autoryzacji użytkowników. Byli zastąpiona nową biblioteką JavaScript Google Identity Services: accounts.google.com/gsi/client

Trzy wcześniejsze moduły JavaScript: api, client i platform używane do wszystkich danych logowania zostało wczytanych z apis.google.com. Pomaga identyfikować lokalizacje która może zostać dodana do witryny z wcześniejszej biblioteki. Zwykle jest to:

• domyślny przycisk logowania wczytuje stronę apis.google.com/js/platform.js,
• grafika przycisku niestandardowego wczytuje apis.google.com/js/api:client.js,
• bezpośrednie wykorzystanie zasobów typu gapi.client wczytuje się apis.google.com/js/api.js.

W większości przypadków możesz nadal używać istniejącego identyfikatora klienta aplikacji internetowej dane logowania. Przed migracją zalecamy zapoznanie się Zasady OAuth 2.0 i korzystanie z Konsoli interfejsów API Google i w razie potrzeby zaktualizuj następujące ustawienia klienta:

• aplikacje testowe i produkcyjne mają oddzielne projekty Client ID (Identyfikatory klientów),
• typ identyfikatora klienta OAuth 2.0 to „Aplikacja internetowa” oraz
• W przypadku autoryzowanych źródeł JavaScript i identyfikatorów URI przekierowania protokół HTTPS jest używany.

Zidentyfikuj kod, którego dotyczy problem, i przetestuj go

Plik cookie debugowania ułatwia znalezienie kodu, którego dotyczy problem, i przetestowanie po jego wycofaniu zachowanie użytkownika.

W dużych lub złożonych aplikacjach może być trudno znaleźć cały kod, którego dotyczy wycofanie modułu gapi.auth2. Aby zapisać bieżące użycie usługi, która wkrótce będzie wycofane w konsoli, ustaw wartość G_AUTH2_MIGRATION plik cookie do informational. Opcjonalnie dodaj dwukropek, a po nim wartość kluczową, do a także do pamięci sesji. Po zalogowaniu się i otrzymaniu weryfikacji danych logowania lub wysyłania zebranych logów do backendu w celu późniejszej analizy. Dla: na przykład informational:showauth2use zapisuje źródło i adres URL w pamięci sesji klucz o nazwie showauth2use.

Aby weryfikować działanie aplikacji po tym, jak moduł gapi.auth2 nie jest już wczytywany, ustaw parametr z pliku cookie G_AUTH2_MIGRATION dla enforced. Umożliwia to testowanie działania po wycofaniu usługi przed datą wejścia w życie zasad.

Możliwe wartości pliku cookie G_AUTH2_MIGRATION:

• enforced Nie wczytuj modułu gapi.auth2.
• informational Loguje użycie wycofanych funkcji w konsoli JS. Także zapisz w pamięci sesji, gdy ustawiono opcjonalną nazwę klucza: informational:key-name

Aby zminimalizować wpływ na użytkowników, zalecamy najpierw ustawienie tego pliku cookie lokalnie w fazie programowania i testów, a przed użyciem w środowiskach produkcyjnych.

HTML i JavaScript

W tym scenariuszu logowania tylko przy uwierzytelnianiu możesz skorzystać z przykładowego kodu i renderowania widoczny jest istniejący przycisk logowania przez Google. Wybierz wyskakujące okienko lub przekierowanie aby zobaczyć różnice w sposobie obsługi odpowiedzi wywołanie zwrotne JavaScript lub bezpieczne przekierowanie do loginu na serwerze backendu. punktu końcowego.

Wcześniej

<html>
  <body>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
    <div class="g-signin2" data-onsuccess="handleCredentialResponse"></div>
  </body>
</html>

<html>
  <body>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
    <div class="g-signin2" data-onsuccess="handleCredentialResponse"></div>
    <script>
      function handleCredentialResponse(googleUser) {
        ...
        var xhr = new XMLHttpRequest();
        xhr.open('POST', 'https://yourbackend.example.com/tokensignin');
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xhr.onload = function() {
          console.log('Signed in as: ' + xhr.responseText);
        };
        xhr.send('idtoken=' + id_token);
      }
    </script>
  </body>
</html>

Nowy sposób

Aby używać nowej biblioteki w scenariuszu logowania tylko przy uwierzytelnianiu, wybierz z trybu wyskakującego lub przekierowania i użyj przykładowego kodu, aby zastąpić istniejącą już implementację na stronie logowania.

<html>
  <body>
    <script src="https://accounts.google.com/gsi/client" async defer></script>
    <div id="g_id_onload"
         data-client_id="YOUR_CLIENT_ID"
         data-callback="handleCredentialResponse">
    </div>
    <div class="g_id_signin" data-type="standard"></div>
  </body>
</html>

<html>
  <body>
    <script src="https://accounts.google.com/gsi/client" async defer></script>
    <div id="g_id_onload"
         data-client_id="YOUR_CLIENT_ID"
         data-ux_mode="redirect"
         data-login_uri="https://www.example.com/your_login_endpoint">
    </div>
    <div class="g_id_signin" data-type="standard"></div>
  </body>
</html>

W tym przykładzie obejmującym tylko uwierzytelnianie nowe accounts.google.com/gsi/client biblioteka, klasa g_id_signin i obiekt g_id_onload zastępują wcześniejsze Biblioteka apis.google.com/js/platform.js i obiekt g-signin2.

Oprócz renderowania nowego spersonalizowanego przycisku wyświetla nowe wyskakujące okienko One Tap. Za każdym razem, gdy jest widoczny spersonalizowany przycisk, zdecydowanie zalecamy też wyświetlanie wyskakującego okienka jednym dotknięciem w celu zminimalizowania podczas rejestracji i logowania.

Chociaż nie jest to zalecane ze względu na większe problemy z logowaniem, spersonalizowany przycisk może być wyświetlany osobno, bez wyświetlania jednocześnie Okno dialogowe jednym dotknięciem. Aby to zrobić, ustaw wartość atrybutu data-auto_prompt na false.

Interfejsy API HTML i JavaScript

Poprzedni przykład pokazuje, jak za pomocą nowego interfejsu HTML API dodać mechanizm logowania do do Twojej witryny. Możesz też użyć odpowiednika funkcjonalnego JavaScript API, możesz też łączyć i dopasowywać interfejsy API HTML oraz JavaScript w całej swojej witrynie.

Interaktywne wyświetlanie opcji dostosowywania przycisków, takich jak typ wywołania zwrotnego i takie jak kolor, rozmiar, kształt, tekst i motyw, sprawdź nasz Kod . Można go używać do szybkiego porównywania różnych opcji i generowania Fragmenty HTML do wykorzystania w witrynie.

Logowanie się jednym dotknięciem z dowolnej strony

jedno dotknięcie to nowy, łatwy sposób na rejestrowanie się i logowanie w Twojej witrynie. Umożliwia użytkownikom logowanie się bezpośrednio na dowolnej stronie w witrynie, eliminuje konieczność odwiedzania specjalnej strony logowania przez użytkowników. Innymi słowy, Upraszcza to rejestrację i logowanie, dając użytkownikom elastyczność rejestracji i logowania ze stron innych niż strona logowania.

Aby umożliwić logowanie się z dowolnej strony, zalecamy dodanie g_id_onload wspólny nagłówek, stopkę lub inny obiekt w całej witrynie,

Zalecamy również dodanie g_id_signin, który wyświetla spersonalizowane logowanie tylko na stronach logowania lub zarządzania kontem użytkownika. Daj użytkownikom wybór rejestracji lub logowania, wyświetlając przycisk obok innych sfederowanych przycisków dostawcy tożsamości oraz pól do wpisania nazwy użytkownika i hasła.

Odpowiedź tokena

Logowanie się użytkowników nie wymaga już znajomości protokołu OAuth 2.0 ani korzystania z niego z kodów autoryzacji, tokenów dostępu ani tokenów odświeżania. Zamiast tego tokenu internetowego JSON Token identyfikatora (JWT) służy do udostępniania stanu logowania i profilu użytkownika. Jako do dalszego uproszczenia, nie trzeba już używać styl metod akcesorów do pracy z danymi w profilu użytkownika.

Bezpieczne dane uwierzytelniające tokena identyfikatora JWT podpisany przez Google są zwracane:

• do modułu obsługi wywołań zwrotnych JavaScript w przeglądarce w trybie wyskakującego okienka,
• do serwera backendu przez przekierowanie Google do punktu końcowego logowania, przycisk Zaloguj się przez Google ux_mode ma wartość redirect.

W obu przypadkach zaktualizuj istniejące moduły obsługi wywołań zwrotnych, usuwając:

• połączenia z numerem googleUser.getBasicProfile(),
• odwołania do BasicProfile i powiązane wywołania getId(), getName(), getGivenName(), getFamilyName(), getImageUrl(), getEmail() metod oraz
• za pomocą obiektu AuthResponse.

Zamiast tego w nowym tokenie JWT użyj bezpośrednich odwołań do credential pól podrzędnych Obiekt CredentialResponse do pracy z danymi z profilu użytkownika.

Dodatkowo (tylko w trybie przekierowania) pamiętaj, by uniemożliwić wysyłanie żądań z innych witryn Forgery (CSRF) i weryfikacja tokena identyfikatora Google na serwerze backendu.

Aby lepiej zrozumieć, jak użytkownicy korzystają z Twojej witryny, Za pomocą pola select_by w kolumnie CredentialResponse można określić użytkownika i konkretny proces logowania.

Zgoda użytkownika i unieważnianie uprawnień

Gdy użytkownik po raz pierwszy loguje się w Twojej witrynie, Google prosi go o zgodę , aby udostępnić Twojej aplikacji profil konta. Dopiero po wyrażeniu zgody profilu użytkownika udostępnionego aplikacji w ładunku danych logowania tokena tożsamości. Anulowanie dostępu do tego profilu jest równoważne unieważnieniu tokena dostępu w do biblioteki wcześniejszego logowania.

Użytkownicy mogą anulować uprawnienia aplikacji i odłączyć ją od swojego konta Google wchodząc na stronę https://myaccount.google.com/permissions. Mogą też odłączyć się bezpośrednio od Twojej aplikacji, aktywując interfejs API. zaimplementowanego przez Ciebie wywołania; wcześniejsza metoda disconnect została zastąpiono nowszą metodą revoke.

Gdy użytkownik usunie swoje konto na Twojej platformie, najlepiej jest użyć revoke, aby odłączyć aplikację od swojego konta Google.

Wcześniej usługa auth2.signOut() mogła być używana do zarządzania wylogowaniem użytkowników. z aplikacji. Należy usunąć wszelkie przypadki użycia aplikacji auth2.signOut() i Twoja aplikacja powinno bezpośrednio zarządzać stanem i stanem logowania poszczególnych użytkowników.

Stan sesji i detektory

Nowa biblioteka nie zachowuje stanu zalogowania ani sesji w przeglądarce .

stan zalogowania na konto Google, stan sesji aplikacji i stan zalogowania to różne, odrębne pojęcia.

Stan logowania użytkownika na jego koncie Google i Twoja aplikacja są niezależne od każdego z wyjątkiem momentu logowania, gdy wiadomo, że użytkownik użytkownik został uwierzytelniony i zalogował się na konto Google.

Jeśli funkcja Zaloguj się przez Google ma włączoną funkcję logowania jednym dotknięciem lub logowania automatycznego użytkownicy witryny muszą najpierw zalogować się na swoje konto Google, aby:

• wyrazić zgodę na udostępnienie swojego profilu użytkownika podczas pierwszej rejestracji, logowania się w witrynie,
• a później na potrzeby logowania przy kolejnych wizytach w witrynie.

Użytkownicy mogą pozostać zalogowani, wylogować się lub przełączyć na inne konto Google a jednocześnie utrzymuje w witrynie aktywną i zalogowaną sesję.

Teraz odpowiadasz za bezpośrednie zarządzanie stanem zalogowania w przypadku użytkowników do aplikacji internetowej. Wcześniej funkcja Logowanie przez Google pomagała monitorować .

Usuń wszelkie odwołania do domeny auth2.attachClickHandler() i jej zarejestrowanych plików dla modułów obsługi wywołań zwrotnych.

Wcześniej funkcja Detektor służyła do udostępniania zmian w stanie zalogowania konto Google użytkownika. Detektory nie są już obsługiwane.

Usuń wszelkie odniesienia do listen(), auth2.currentUser i auth2.isSignedIn

Pliki cookie

W ramach funkcji Zaloguj się przez Google pliki cookie są wykorzystywane w ograniczonym zakresie – co dalej. Zobacz, jak Google używa plików cookie. .

Plik cookie G_ENABLED_IDPS ustawiony przez wcześniejszą bibliotekę platformy logowania Google Nazwa domeny nie jest już używana.

Nowa biblioteka usług tożsamości Google może opcjonalnie ustawić te opcje pliki cookie w zależności od wybranych opcji konfiguracji:

• g_state przechowuje stan wylogowania użytkownika i jest ustawiany przy korzystaniu z jednego dotknięcia wyskakujące okienko lub logowanie automatyczne,

• g_csrf_token to podwójny plik cookie używany do zapobiegania atakom CSRF i jest ustawiany po wywołaniu punktu końcowego logowania. Wartość identyfikatora URI logowania. może być jawnie ustawiony lub może być domyślnym identyfikatorem URI bieżącej strony. Twoje punkt końcowy logowania można wywołać w tych warunkach, gdy używany jest:

  • Interfejs API HTML z wartością data-ux_mode=redirect lub gdy data-login_uri ma wartość ustaw lub

  • JavaScript API z parametrem ux_mode=redirect i gdziem google.accounts.id.prompt() nie służy do wyświetlania jednym dotknięciem ani Logowanie automatyczne.

Jeśli masz usługę, która zarządza plikami cookie, pamiętaj o dodaniu dwóch nowych plików cookie a po zakończeniu migracji usunąć poprzedni plik cookie.

Jeśli zarządzasz wieloma domenami lub subdomenami, przeczytaj artykuł Wyświetlanie jednym dotknięciem Subdomen, w których znajdują się dalsze instrukcje na temat pracy z plikiem cookie g_state.

Dokumentacja migracji obiektów związanej z logowaniem się użytkowników