Data publikacji: 9 maja 2025 r.
Klucze dostępu zapewniają silne uwierzytelnianie odporne na phishing. Jednak zachęcenie użytkowników do korzystania z nich może być trudne. Dzięki automatycznemu tworzeniu kluczy dostępu możesz tworzyć klucze dostępu dla użytkowników w odpowiednim momencie, o ile mają już zapisane hasło do Twojej witryny. Warunkowe tworzenie, które umożliwia automatyczne tworzenie kluczy dostępu, jest częścią specyfikacji WebAuthn.
Jak to działa
Aby ułatwić użytkownikom korzystanie z kluczy dostępu, użyj funkcji interfejsu WebAuthn API o nazwie Conditional Create. Funkcja warunkowego tworzenia umożliwia witrynie poproszenie o klucz dostępu użytkownika bez konieczności podejmowania przez niego jakichkolwiek działań.
Ten proces działa, gdy są spełnione te warunki:
- Użytkownik ma zapisane hasło w domyślnym menedżerze haseł.
- Hasło było niedawno używane. Najlepiej wywołać funkcję Conditional Create natychmiast po pomyślnym zalogowaniu się za pomocą hasła.
Jeśli oba warunki są spełnione, możesz poprosić menedżera haseł o utworzenie klucza dostępu dla użytkownika, wywołując funkcję Conditional Create. Po utworzeniu klucza dostępu użytkownik otrzymuje powiadomienie w zależności od menedżera haseł.
Zgodność
Funkcja warunkowego tworzenia jest obsługiwana przez Safari na macOS i wszystkie przeglądarki na iOS, a także przez Chrome na komputerach i Chrome na Androidzie.
Implementowanie warunkowego tworzenia
Automatyczne tworzenie kluczy dostępu jest oparte na funkcji interfejsu WebAuthn API o nazwie Conditional Create (Tworzenie warunkowe). Są to zwykłe żądania WebAuthn create()
z parametrem mediation
ustawionym na "conditional"
, które działają podobnie do automatycznego wypełniania klucza dostępu w przypadku żądań get()
.
Użyj warunkowego tworzenia po zalogowaniu się użytkownika za pomocą hasła. Powodzenie utworzenia zależy od menedżera haseł i spełnienia określonych warunków. Warunki te mogą się różnić w zależności od menedżera haseł i mogą się z czasem zmieniać. Na przykład w Chrome z Menedżerem haseł Google użytkownik musi niedawno zalogować się w witrynie za pomocą zapisanego hasła.
Jeśli przeglądarce uda się utworzyć klucz dostępu, zwróci ona dane logowania z kluczem publicznym. Wyślij te dane logowania do backendu, aby dokończyć rejestrację i umożliwić przyszłe uwierzytelnianie.
Wykrywanie cech
Możesz sprawdzić, czy w przeglądarce jest dostępna funkcja Conditional Create, wywołując PublicKeyCredential.getClientCapabilities()
. Sprawdź, czy zwrócony obiekt zawiera wartość true
we właściwości conditionalCreate
.
if (window.PublicKeyCredential && PublicKeyCredential.getClientCapabilities) {
const capabilities = await PublicKeyCredential.getClientCapabilities();
if (capabilities.conditionalCreate) {
// Conditional create is available
}
}
Jeśli getClientCapabilities
jest niedostępny, warunkowe tworzenie również jest niedostępne.
Warunkowe tworzenie klucza dostępu
Aby automatycznie utworzyć klucz dostępu, wywołaj funkcję
navigator.credentials.create()
, ale z parametrem mediation: "conditional"
w ten sposób.
const cred = await navigator.credentials.create({
publicKey: options,
// Request conditional creation
mediation: 'conditional'
});
Automatyczne tworzenie kluczy dostępu powinno być używane natychmiast po zalogowaniu się użytkownika, aby zwiększyć szansę na spełnienie kryteriów menedżera haseł dotyczących automatycznego tworzenia.
Wynikowe dane logowania klucza publicznego możesz wysłać na serwer, aby zweryfikować i zarejestrować klucz dostępu. Upewnij się, że użytkownik jest zalogowany na serwerze.
Zastrzeżenia
Samo tworzenie warunkowe nie jest trudne do wdrożenia, ale podczas integrowania tej funkcji z istniejącym systemem należy zachować ostrożność.
Ignorowanie obecności użytkownika i weryfikacji użytkownika na serwerze
Odpowiedź rejestracyjna zwraca zarówno „User Presence”, jak i „User Verified” jako false
, więc serwer powinien zignorować te flagi podczas weryfikacji danych logowania.
Przerywanie trwającego wywołania WebAuthn przed automatycznym utworzeniem klucza dostępu
Gdy RP oczekuje, że użytkownik zaloguje się za pomocą klucza dostępu lub hasła, najlepszym wyborem jest wykonanie warunkowego pobierania. Może to spowodować anulowanie wywołania warunkowego pobierania przed wykonaniem warunkowego tworzenia.
Aby to zrobić, musisz użyć AbortController
i zadzwonić pod numer .abort()
.
// To abort a WebAuthn call, instantiate an AbortController.
const controller = new AbortController();
const cred = await navigator.credentials.get({
publicKey: options,
signal: controller.signal,
// Request conditional get
mediation: 'conditional'
});
// Abort the call
controller.abort();
Ignorowanie wyjątków
Podczas warunkowego tworzenia klucza dostępu w kilku przypadkach należy ignorować wyjątki:
InvalidStateError
: klucz dostępu już istnieje u dostawcy kluczy dostępu (nie zapomnij podaćexcludeCredentials
).NotAllowedError
: Utworzenie klucza dostępu nie spełnia warunku.AbortError
: połączenie WebAuthn zostało przerwane.
Wyświetlanie błędów w tych przypadkach może wprowadzać użytkownika w błąd, ponieważ przeglądarka obsługuje je w sposób niewidoczny: powiadomienie jest wyświetlane tylko w przypadku powodzenia, a niepowodzenia nie powodują wyświetlania widocznych komunikatów.
Sygnalizowanie, gdy rejestracja klucza dostępu się nie powiedzie
Jeśli klucz dostępu zostanie utworzony, ale nie uda się go zarejestrować na serwerze, użytkownik nie będzie mógł się zalogować. Może się tak zdarzyć, gdy lista kluczy dostępu jest niespójna między dostawcą kluczy dostępu a serwerem.
Aby uniknąć takich sytuacji, używaj interfejsu Signal API, aby zachować spójność.
Uaktualnienie z logowania bez hasła nie jest obsługiwane
Na tym etapie warunkowe tworzenie klucza dostępu jest uzależnione od wpisania przez użytkownika prawidłowego hasła. Oznacza to, że metody logowania bez hasła, takie jak linki magiczne, weryfikacja numeru telefonu czy federacja tożsamości, nie spełniają tego warunku.
Podsumowanie
Automatyczne tworzenie kluczy dostępu może przyspieszyć ich wdrażanie w Twojej witrynie, pomagając użytkownikom przejść z haseł na bezpieczniejszą metodę uwierzytelniania.
Więcej informacji o kluczach dostępu znajdziesz w artykule Logowanie bez hasła przy użyciu kluczy dostępu.