Chrome 128 ve 129, WebAuthn için heyecan verici yeni özellikler sunar: geçiş anahtarı tabanlı kimlik doğrulama sistemleri oluşturmak için temel API.
- İpuçları: İpuçları, bağlı tarafların (RP'ler) WebAuthn üzerinde daha iyi kontrol sahibi olmasını sağlar Tarayıcıdaki kullanıcı arayüzü. Bu özellikler, özellikle de geçiş yapmak isteyen kurumsal güvenlik anahtarlarını kullanabilir.
- İlgili kaynak istekleri: İlgili kaynakla RP'ler, geçiş anahtarlarını birden fazla alan adında geçerli hâle getirebilir. Birden fazla artık kullanıcılarınızın geçiş anahtarlarını sitelerinizde tekrar kullanmalarını sağlayabilirsiniz. Böylece girişle ilgili zorluklar ortadan kalkmış olur.
- JSON serileştirme: JSON serileştirme API'leri, seçenekleri kodlama ve kod çözme yoluyla bir RP'nin ön uç kodunu basitleştirmenizi sağlar ve WebAuthn API'ye veya WebAuthn API'den iletilen kimlik bilgileri.
İpuçları
hints
ile, bağlı taraflar (RP) artık bir oluşturmak için kullanıcı arayüzü tercihlerini belirtebilir
geçiş anahtarı veya geçiş anahtarıyla kimlik doğrulaması yapma.
Önceden kısıtlanmış taraf, kullanıcının kimlik doğrulayıcıyı yalnızca tek tek
geçiş anahtarı oluşturabilir veya kimlik doğrulaması için
"platform"
belirtmek için authenticatorSelection.authenticatorAttachment
veya
"cross-platform"
. Bunlar sırasıyla kimlik doğrulayıcıyı bir platformla sınırlandırırlar.
kimlik doğrulayıcı
veya dolaşımda
kimlik doğrulayıcı.
hints
ile bu spesifikasyon daha esnek olabilir.
Kısıtlanmış taraf, isteğe bağlı PublicKeyCredentialCreationOptions
içinde isteğe bağlı hints
veya
"security-key"
belirtmek için PublicKeyCredentialRequestOptions
,
Bir dizide, tercih sırasına göre "client-device"
ve "hybrid"
.
Aşağıda,
İpucu olarak "security-key"
ile "cross-platform"
kimlik doğrulayıcı. Bu durum
Chrome, kurumsal kullanıcılar için güvenlik anahtarı odaklı bir kullanıcı arayüzü gösterir.
const credential = await navigator.credentials.create({
publicKey: {
challenge: *****,
hints: ['security-key'],
authenticatorSelection: {
authenticatorAttachment: 'cross-platform'
}
}
});
.
!["security-key" değerini belirterek tarayıcıda güvenlik anahtarı odaklı bir iletişim kutusu gösterilir.](https://developer.chrome.com/static/blog/passkeys-updates-chrome-129/image/security-key.png?hl=tr)
Kısıtlanmış taraf, cihazlar arası doğrulama senaryosuna öncelik vermek istediğinde
"cross-platform"
kimlik doğrulayıcıyı tercih eden bir kimlik doğrulama isteği gönder
"hybrid"
ile başlayın.
const credential = await navigator.credentials.create({
publicKey: {
challenge: *****,
residentKey: true,
hints: ['hybrid']
authenticatorSelection: {
authenticatorAttachment: 'cross-platform'
}
}
});
.
!["Karma" değerini belirterek tarayıcıda, cihazlar arası giriş odaklı bir iletişim kutusu gösterilir.](https://developer.chrome.com/static/blog/passkeys-updates-chrome-129/image/cross-device.png?hl=tr)
İlgili kaynak istekleri
İlgili Kökenli İstekler ise RP'ler geçiş anahtarlarını birden fazla alan adından kullanılabilir hale getirebilirsiniz. Merkezi giriş oluşturma ve federasyon protokollerini kullanmak hâlâ çoğu sitede bulabilirsiniz. Ancak birden fazla alanınız varsa ve federasyon mümkün değilse ilgili kaynaklar çözüm olabilir.
Tüm WebAuthn isteklerinde bağlı taraf kimliği (RP kimliği) ve tüm geçiş anahtarları belirtilmelidir
tek bir RP kimliğiyle ilişkili olmalıdır. Geleneksel olarak, bir kaynak yalnızca
alanına dayalı bir Kısıtlanmış Taraf Kimliği. Bu durumda www.example.co.uk
,
Kısıtlanmış taraf kimliği example.co.uk
olmalı, example.com
olmamalıdır. İlgili Kökenli
İstekler; talep edilen bir RP kimliği, iyi bilinen bir JSON dosyası getirilerek doğrulanabilir
Hedef alandan /.well-known/webauthn
adresinde bulunanlar. Yani example.co.uk
(ve example.in
, example.de
vb.) tamamı şu Kısıtlanmış Taraf Kimliği kullanabilir
example.com
bunları aşağıdaki biçimde belirtiyorsa example.com
:
URL: https://example.com/.well-known/webauthn
{
"origins": [
"https://example.co.uk",
"https://example.de",
"https://example.sg",
"https://example.net",
"https://exampledelivery.com",
"https://exampledelivery.co.uk",
"https://exampledelivery.de",
"https://exampledelivery.sg",
"https://myexamplerewards.com",
"https://examplecars.com"
]
}
İlgili Kaynak İstekleri'ni nasıl oluşturacağınızı öğrenmek için Geçiş anahtarının şu cihazlarınızda yeniden kullanılmasına izin verme: İlişkili Köklü siteler İstekler.
JSON serileştirme
WebAuthn istek ve yanıt nesnelerinde, RAW içeren birden çok alan bulunur ArrayBuffer'daki kimlik bilgisi kimliği, kullanıcı kimliği veya sorgulama gibi ikili veriler. Bir web sitesi bu verileri sunucusuyla değiş tokuş etmek için JSON kullanmak isterse ikili program verilerinin ilk olarak (örneğin, Base64URL ile) kodlanması gerekir. Bu, projenin yürütülmesi sırasında web sitelerinde geçiş anahtarı kullanmaya başlamak isteyen geliştiriciler için daha karmaşıktır.
WebAuthn artık ayrıştırılacak API'ler sunuyor
PublicKeyCredentialCreationOptions
ve
PublicKeyCredentialRequestOptions
WebAuthn nesnelerini doğrudan JSON dosyasından yapabilir ve
PublicKeyCredential
JSON biçiminde bir yanıt oluşturabilirsiniz. Ham ikili program içeren tüm ArrayBuffer değerli alanlar
verileri otomatik olarak Base64URL kodlamalı değerlerine veya bu değerlere dönüştürülür.
Bu API'ler Chrome 129 sürümünde kullanılabilir.
Geçiş anahtarı oluşturmadan önce JSON kodlu bir kod getirin
PublicKeyCredentialCreationOptions
nesnesini sorgulayın ve bunu
PublicKeyCredential.parseCreationOptionsFromJSON()
.
export async function registerCredential() {
// Fetch encoded `PublicKeyCredentialCreationOptions`
// and JSON decode it.
const options = await fetch('/auth/registerRequest').json();
// Decode `PublicKeyCredentialCreationOptions` JSON object
const decodedOptions = PublicKeyCredential.parseCreationOptionsFromJSON(options);
// Invoke the WebAuthn create() function.
const cred = await navigator.credentials.create({
publicKey: decodedOptions,
});
...
Geçiş anahtarı oluşturduktan sonra, elde edilen kimlik bilgisini toJSON()
kullanarak kodlayın.
sunucuya gönderilebileceğinden emin olun.
...
const cred = await navigator.credentials.create({
publicKey: options,
});
// Encode the credential to JSON and stringify
const credential = JSON.stringify(cred.toJSON());
// Send the encoded credential to the server
await fetch('/auth/registerResponse', credential);
...
Geçiş anahtarıyla kimlik doğrulaması yapmadan önce JSON kodlu bir dosya getirin.
PublicKeyRequestCreationOptions
kodlayıcısını kullanarak kodu çözün ve kodunu
PublicKeyCredential.parseRequestOptionsFromJSON()
.
export async function authenticate() {
// Fetch encoded `PublicKeyCredentialRequestOptions`
// and JSON decode it.
const options = await fetch('/auth/signinRequest').json();
// Decode `PublicKeyCredentialRequestOptions` JSON object
const decodedOptions = PublicKeyCredential.parseRequestOptionsFromJSON(options);
// Invoke the WebAuthn get() function.
const cred = await navigator.credentials.get({
publicKey: options
});
...
Geçiş anahtarıyla kimlik doğrulaması yaptıktan sonra, elde edilen kimlik bilgisini
toJSON()
yöntemini çağırın.
...
const cred = await navigator.credentials.get({
publicKey: options
});
// Encode the credential to JSON and stringify
const credential = JSON.stringify(cred.toJSON());
// Send the encoded credential to the server
await fetch(`/auth/signinResponse`, credential);
...
Daha fazla bilgi
WebAuthn ve geçiş anahtarları hakkında daha fazla bilgi edinmek için aşağıdaki kaynaklara göz atın: