Credential Management API

Meggin Kearney
Meggin Kearney

Credential Management API to oparty na standardach interfejs API przeglądarki, który zapewnia zautomatyzowany interfejs między stroną a przeglądarką, co umożliwia bezproblemowe logowanie się na różnych urządzeniach.

Interfejs Credential Management API:

  • Usprawnianie logowania – użytkownicy mogą być automatycznie logowani z powrotem w witrynie, nawet jeśli ich sesja wygasła lub zapisali dane logowania na innym urządzeniu.
  • Pozwala na logowanie się jednym dotknięciem za pomocą funkcji wyboru konta – użytkownicy mogą wybrać konto w natywnym narzędziu wyboru kont.
  • Przechowuj dane logowania – aplikacja może przechowywać kombinację nazwy użytkownika i hasła, a nawet sfederowane dane konta. Dane logowania mogą być synchronizowane między urządzeniami za pomocą przeglądarki.

Chcesz zobaczyć, jak to działa? Wypróbuj prezentację interfejsu Credential Management API i zapoznaj się z kodem.

Sprawdź obsługę interfejsu Credential Management API w przeglądarce

Obsługa przeglądarek

  • 51
  • 18
  • 60
  • 13

Źródło

Zanim zaczniesz korzystać z interfejsu Credential Management API, sprawdź, czy obsługiwany jest interfejs PasswordCredential lub FederatedCredential.

if (window.PasswordCredential || window.FederatedCredential) {
  // Call navigator.credentials.get() to retrieve stored
  // PasswordCredentials or FederatedCredentials.
}

Zaloguj użytkownika

Aby zalogować użytkownika, pobierz dane logowania z menedżera haseł przeglądarki i użyj ich do zalogowania się.

Na przykład:

  1. Gdy użytkownik trafi do Twojej witryny, który nie jest zalogowany, wywołaj metodę navigator.credentials.get().
  2. Użyj pobranych danych logowania, aby zalogować użytkownika.
  3. Zaktualizuj interfejs, aby wskazać, że użytkownik jest zalogowany.

Więcej informacji znajdziesz w artykule Logowanie użytkowników.

Zapisywanie i aktualizowanie danych logowania użytkownika

Jeśli użytkownik zalogował się przy użyciu sfederowanego dostawcy tożsamości, takiego jak Google Sign-In, Facebook czy GitHub:

  1. Gdy użytkownik zaloguje się lub utworzy konto, utwórz FederatedCredential z adresem e-mail użytkownika jako identyfikatorem i określ dostawcę tożsamości za pomocą FederatedCredentials.provider.
  2. Zapisz obiekt danych logowania za pomocą narzędzia navigator.credentials.store().

Więcej informacji znajdziesz w artykule Logowanie użytkowników.

Jeśli użytkownik zalogował się przy użyciu nazwy użytkownika i hasła:

  1. Gdy użytkownik zaloguje się lub utworzy konto, utwórz PasswordCredential z identyfikatorem użytkownika i hasłem.
  2. Zapisz obiekt danych logowania za pomocą narzędzia navigator.credentials.store().

Więcej informacji znajdziesz w artykule Zapisywanie danych logowania z Formularzy.

Wyloguj się

Gdy użytkownik się wyloguje, wywołaj navigator.credentials.preventSilentAccess(), aby uniemożliwić jego automatyczne ponowne zalogowanie.

Wyłączenie automatycznego logowania umożliwia też użytkownikom łatwe przełączanie się między kontami, na przykład między kontami służbowymi a osobistymi lub między kontami na współdzielonych urządzeniach, bez konieczności ponownego podawania danych logowania.

Więcej informacji znajdziesz w sekcji Wyloguj się.

Prześlij opinię