Controllo del rilevamento delle funzionalità dell'API Credential Management

Eiji Kitamura

Riepilogo

WebAuthn contribuisce ad aumentare la sicurezza portando sul web l'autenticazione basata su credenziali con chiave pubblica e sarà presto supportato in Chrome, Firefox ed Edge (con la specifica aggiornata). Aggiunge un nuovo tipo di oggetto Credential, che tuttavia potrebbe danneggiare i siti web che utilizzano l'API Credential Management senza rilevare le funzionalità dei tipi di credenziali specifici che utilizzano.

Se al momento utilizzi questo metodo per il rilevamento delle funzionalità,

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

Cosa fare invece

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()
}

Guarda le modifiche apportate al codice campione come esempio.

Per saperne di più, continua a leggere quanto segue.

Nota: se utilizzi Google Identity come metodo principale per l'accesso degli utenti, valuta la possibilità di utilizzare la libreria JavaScript per la registrazione con un tocco e l'accesso automatico basata sull'API Credential Management. Combina l'accesso con Google e l'accesso basato su password in un'unica chiamata API e aggiunge il supporto per la creazione di account con un solo tocco.

Che cos'è l'API Credential Management

L'API Credential Management (API CM) consente ai siti web di accedere in modo programmatico all'archivio credenziali dello user agent per archiviare/recuperare le credenziali utente per l'origine chiamante.

Le API di base sono:

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

La specifica originale dell'API CM definisce due tipi di credenziali:

• PasswordCredential
• FederatedCredential

PasswordCredential è una credenziale che contiene l'ID e la password dell'utente. FederatedCredential è una credenziale che contiene l'ID dell'utente e una stringa che rappresenta un provider di identità.

Con queste due credenziali, i siti web possono:

• Consenti all'utente di accedere con una credenziale federata o basata su password salvata in precedenza non appena arriva (accesso automatico).
• Memorizza la credenziale federata o basata su password con cui l'utente ha eseguito l'accesso.
• Mantenere aggiornate le credenziali di accesso dell'utente (ad es. dopo una modifica della password)

Che cos'è WebAuthn

WebAuthn (Web Authentication) aggiunge le credenziali di chiave pubblica all'API CM. Ad esempio, offre ai siti web un modo standardizzato per implementare l'autenticazione a due fattori utilizzando dispositivi di autenticazione conformi a FIDO 2.0.

A livello tecnico, WebAuthn estende l'API CM con l'interfaccia PublicKeyCredential.

Qual è il problema?

In precedenza, abbiamo guidato gli sviluppatori nel rilevamento delle funzionalità dell'API CM con il seguente codice:

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 browser<s**
table class="properties with-head><ing-t><in>t<&q><uot>;<tb>odytr
th/th
thPasswordCredential / Feder<ate>d<Cr>edential/th
thPubli<cKe>y<Cre><de><nt>ial/th
</tr><tr>thChrome
/<tht><dA>vailable
/tdtdI<n d><eve><lo><pm>ent
/td/<trt><rt>hFir<efo><x<>/span>
/thtdN/A
/tdtdAiming <to ><shi><p ><on> 60
/<td/><tr>trth<Edg><e<>/span>
/thtdN/A
/tdtdImp<lemented with a href="https://blogs.windows.com/msedgedev/2016/04/12/a-world-without-passwords-windows-hello->in-micros<of>t-edge/"older API/a. New API (navigator.cr<ede><nti><als) c><oming >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()
}

Guarda le modifiche effettive apportate al codice campione come esempio.

Per riferimento, ecco come rilevare PublicKeyCredential aggiunta in WebAuthn:

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

Cronologia

La prima implementazione disponibile di WebAuthn è Firefox e la stabilità è prevista per l'inizio di maggio 2018.

Finally

Per qualsiasi domanda, invia un'email all'indirizzo @agektmr o [e-mail].