Credential Management API Özellik Algılama Kontrolü

Eiji Kitamura

Özet

WebAuthn, web'e herkese açık anahtar kimlik bilgisi tabanlı kimlik doğrulama getirerek güvenliği artırmaya yardımcı olur ve yakında Chrome, Firefox ve Edge'de (güncellenmiş spesifikasyonla) desteklenecek. Yeni bir Credential nesnesi ekler. Ancak bu nesne, kullandıkları belirli kimlik bilgisi türlerini özellik algılamadan Kimlik Bilgisi Yönetimi API'sini kullanan web sitelerini bozabilir.

Şu anda bunu özellik algılama için yapıyorsanız

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
    // use CM API
}

Bunun yerine şunları yapın

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

if (window.PasswordCredential) {
    // Get/Store PasswordCredential
}

if (window.FederatedCredential) {
    // Get/Store FederatedCredential
}

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
    // Call navigator.credentials.preventSilentAccess()
}

Örnek olarak, örnek kodda yapılan değişikliklere bakın.

Daha fazla bilgi için okumaya devam edin.

Not: Kullanıcılarınızın oturum açma yöntemi olarak birincil olarak Google kimliğini kullanıyorsanız Kimlik Bilgisi Yönetimi API'si üzerine inşa edilmiş tek dokunuşla kaydolma ve otomatik oturum açma JavaScript kitaplığını kullanabilirsiniz. Google ile oturum açma ve şifreye dayalı oturum açma işlemlerini tek bir API çağrısında birleştirir ve tek dokunuşla hesap oluşturma desteği ekler.

Credential Management API nedir?

Credential Management API (CM API), çağrı kaynağı için kullanıcı kimlik bilgilerini depolamak/almak üzere web sitelerine, kullanıcı aracısının kimlik bilgisi deposuna programatik erişim sağlar.

Temel API'ler şunlardır:

• navigator.credentials.get()
• navigator.credentials.store()
• navigator.credentials.create()
• navigator.credentials.preventSilentAccess()

Orijinal CM API spesifikasyonunda 2 kimlik bilgisi türü tanımlanır:

• PasswordCredential
• FederatedCredential

PasswordCredential, kullanıcının kimliğini ve şifresini içeren bir kimlik bilgisidir. FederatedCredential, kullanıcının kimliğini ve kimlik sağlayıcıyı temsil eden bir dize içeren bir kimlik bilgisidir.

Web siteleri bu 2 kimlik bilgisiyle şunları yapabilir:

• Kullanıcının giriş yaptığı anda (otomatik oturum açma), önceden kaydedilmiş şifre tabanlı veya birleşik kimlik bilgileriyle oturum açmasına izin verin
• Kullanıcının oturum açtığı şifre tabanlı veya birleşik kimlik bilgisini saklayın,
• Kullanıcının oturum açma kimlik bilgilerini güncel tutma (ör. şifre değişikliğinden sonra)

WebAuthn nedir?

WebAuthn (Web Kimlik Doğrulaması), CM API'ye ortak anahtar kimlik bilgileri ekler. Örneğin, web sitelerine FIDO 2.0 uyumlu kimlik doğrulama cihazları kullanarak iki faktörlü kimlik doğrulamayı standart bir şekilde uygulama olanağı sunar.

WebAuthn, teknik düzeyde CM API'yi PublicKeyCredential arayüzüyle genişletir.

Sorun nedir?

Daha önce, geliştiricilere aşağıdaki kodu kullanarak CM API'yi algılama konusunda yol gösteriyorduk:

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
  // Use CM API
}

But as you can see from the descriptions above, the `navigator.credentials` is
now expanded to support public-key credentials in addition to password
credentials and federated credentials.

The problem is that user agents don't necessarily support all kinds of
credentials. If you continue feature detect using `navigator.credentials`, your
website may break when you are using a certain credential type not supported by
the browser.

**Supported credential types by browsers**
<table class="properties with-heading-tint"><tbody><tr>
<th></th>
<th>PasswordCredential / FederatedCredential</th>
<th>PublicKeyCredential</th>
</tr><tr><th>Chrome
</th><td>Available
</td><td>In development
</td></tr><tr><th>Firefox
</th><td>N/A
</td><td>Aiming to ship on 60
</td></tr><tr><th>Edge
</th><td>N/A
</td><td>Implemented with <a href="https://blogs.windows.com/msedgedev/2016/04/12/a-world-without-passwords-windows-hello-in-microsoft-edge/">older API</a>. New API (navigator.credentials) coming soon.
</td></tr></tbody></table>


## The solution
You can avoid this by modifying feature detection code as follows to explicitly
test for the credential type that you intend to use.

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

if (window.PasswordCredential) {
    // Get/Store PasswordCredential
}

if (window.FederatedCredential) {
    // Get/Store FederatedCredential
}

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
    // Call navigator.credentials.preventSilentAccess()
}

Örnek olarak, örnek kodda yapılan gerçek değişiklikleri inceleyin.

Referans olarak, WebAuthn'a eklenen PublicKeyCredential değerinin nasıl algılandığını aşağıda görebilirsiniz:

if (window.PublicKeyCredential) {
    // use CM API with PublicKeyCredential added in the WebAuthn spec
}

Zaman çizelgesi

WebAuthn'un kullanıma sunulan en erken uygulaması Firefox'tur ve Mayıs 2018'in başlarında kararlı bir şekilde çalışması planlanmaktadır.

Son olarak

Sorularınız varsa @agektmr veya [e-mail] adresine gönderebilirsiniz.