WebAuthn na vida real

O que é o WebAuthn e por que é necessário

• se a senha é simples - você pode buscá-la;
• se a mesma senha é usada em vários serviços, ao quebrar um deles, o invasor obtém acesso a todos os outros;
• senhas são vulneráveis ​​a ataques de phishing;
• senhas fortes e exclusivas são difíceis de lembrar, portanto o usuário é forçado a anotar a senha no adesivo e colá-la no monitor, onde pode ser facilmente espionada, roubada ou perdida.

Como o WebAuthn funciona

• Cliente (WebAuthn Client) - um navegador que suporta a API WebAuthn;
• Aplicativo da Web - um aplicativo em execução no cliente usando a API WebAuthn para interagir com credenciais;
• credenciais (credencial de chave pública) - um par de chaves criptográficas públicas e privadas associadas a uma conta de usuário;
• O autenticador - um dispositivo ou programa - cria credenciais do usuário e assina solicitações da terceira parte confiável com essas credenciais (outro nome é uma chave eletrônica);
• a terceira parte confiável (WebAuthn Relying Party) - o servidor da Web - armazena a chave pública associada à conta do usuário, verifica a validade da assinatura de suas solicitações com a chave privada armazenada no autenticador.

Criação de credenciais ( MakeCredential )

const credential = await navigator.credentials.create({
    publicKey: publicKeyMakeCredentialOptions
});

Assinando uma solicitação com credenciais já criadas ( GetAssertion )

const assertion = await navigator.credentials.get({
    publicKey: publicKeyGetAssertionOptions
});

Chaves eletrônicas

• chaves independentes de plataforma (autenticadores em roaming);
• Autenticadores de plataforma

const credential = await navigator.credentials.create({
    publicKey: {
        authenticatorSelection: {
            authenticatorAttachment: 'cross-platform',
        },
        ...,
    },
});

Benefícios do WebAuthn

• O usuário não precisa se lembrar e inserir nenhuma senha, e o servidor não armazena senhas de usuário, respectivamente, todas as deficiências que as senhas tinham desaparecido. Roubar um autenticador físico de um usuário é muito mais difícil do que interceptar uma senha transmitida eletronicamente por uma conexão insegura, e um vazamento de chaves públicas no site não abrirá a chave privada oculta no dispositivo.
• origin , . origin . , (thesslstore.com, yubico.com) .
• WebAuthn - . - web- , .
• O próprio WebAuthn como uma API fornece aos desenvolvedores uma abstração sobre a implementação de autenticadores e permite escrever um código uma vez, que funcionará com todos os tipos e tipos de chaves eletrônicas. Assim, o WebAuthn é uma solução escalável para autenticação do usuário.

Suporte WebAuthn

janelas

Linux

Android

iOS

Mac OS

Registro do autenticador

const credential = await navigator.credentials.create({
    publicKey: {
        attestation: 'direct',
         ...,
    },
});

O WebAuthn trabalha em diferentes subdomínios

const credential = await navigator.credentials.create({
    publicKey: {
        rp: {
            name: 'Mail.ru Group',
            id: 'mail.ru',
        },
        ...,
    },
});

O WebAuthn funciona em iframe

1. no aplicativo de autorização ao usar o WebAuthn, determinamos se estamos abertos dentro do iframe ou não;
2. se estivermos abertos dentro do iframe, em vez de chamar a API WebAuthn do navegador, serializamos os parâmetros de chamada e os enviamos pela postMessagejanela pai;
3. na janela pai, desserializamos esses parâmetros e chamamos os métodos WebAuthn;
4. quando recebemos uma resposta, a serializamos da mesma maneira e a enviamos pelo postMessageinterior de um iframe, onde aceitamos essa resposta e executamos processamento adicional.

Automação de Teste WebAuthn

//    WebAuthn   
navigator.credentials.create = (options) => {
    window.credentialsCreateArgs = options;

    return new Promise((resolve, reject) => {
        window.credentialsCreateSuccess = resolve;
        window.credentialsCreateFail = reject;
    });
};

// -    
const credentialsCreateResponse = { /* constant object */ };

window.credentialsCreateSuccess(credentialsCreateResponse);

• verifique se o cliente forma e rola corretamente os parâmetros nas funções WebAuthn;
• verifique a correção das alterações de back-end ao rolar as versões de back-end.

// -    
const credentialsCreateResponse =
    calcCredentialsCreateResponse(window.credentialsCreateArgs);
 
window.credentialsCreateSuccess(credentialsCreateResponse);

1. obtenha os argumentos com os quais os métodos WebAuthn foram chamados;
2. executamos esses argumentos através de uma função que implementa os mesmos algoritmos que os autenticadores reais;
3. obtemos o resultado e o devolvemos de nossas funções substituídas;
4. todo o restante do código em nosso serviço processa essas respostas no modo usual e, como resultado, todo o comportamento do serviço não difere de seu comportamento para usuários reais.

O presente e o futuro da WebAuthn

De que outra forma você pode usar o WebAuthn?

Perguntas e respostas populares

Onde posso comprar uma chave eletrônica?

• Dataway Security
• Linha suave

E se eu perder minha chave eletrônica?

O que devo fazer se outra pessoa obtiver acesso à minha chave eletrônica?

Agora meus dados biométricos serão armazenados nos servidores Mail.ru/Google/Microsoft?

Conclusão

• ao usar o WebAuthn, não é necessário lembrar e inserir senhas;
• WebAuthn - , ;
• WebAuthn ;
• WebAuthn — .

Materiais adicionais

• Web Authentication: An API for accessing Public Key Credentials Level 1
• herrjemand/awesome-webauthn: A curated list of awesome WebAuthn/FIDO2 resources
• artifact-project/webauthn: A set of tools for building an API and interacts with WebAuthn
• Getting started with security keys
• 4 Password Authentication Risk & How to Avoid Them
• WebAuthn ,
• Getting Started with WebAuthn with Nick Steele
• Key generation in Yubico U2F Keys