Solicitar um nome de usuário e senha é tão 2005. Hoje, você pode apenas solicitar uma impressão digital.

 

A autenticação biométrica, que permite a autenticação em um sistema de software com uma impressão digital ou reconhecimento facial, já existe há algum tempo. Em 2003, os IBM Thinkpads tinham um leitor de impressão digital que permitia que você fizesse login no seu computador. Em 2013, a Apple incluiu um leitor de impressão digital no iPhone 5S, embora houvesse outros telefones que o tivessem primeiro (olá, Motorola Atrix!). 

Mas a autenticação biométrica não estava facilmente disponível para aplicativos da web até recentemente.

As novas APIs do navegador da web facilitam a adição de autenticação biométrica forte ao seu aplicativo da web.

O que é autenticação biométrica

Primeiro, vamos falar sobre autenticação em geral. Autenticação biométrica é o termo geral para qualquer método de autenticação que dependa dos atributos físicos de um usuário, como impressão digital, face ou voz.

Existem três categorias de autenticação:

  • Algo que você sabe, como uma senha
  • Algo que você tem, como um dispositivo
  • Algo que você é, como uma impressão digital

A autenticação biométrica tem vantagens significativas sobre outras opções:

  • É difícil perder
  • É difícil roubar
  • Não pode ser compartilhado
  • Você não pode esquecê-lo

Permitir que seus usuários se autentiquem usando sua biometria oferece vantagens significativas de segurança e conveniência. De acordo com “ Autenticação biométrica no iPhone e Android:

Usabilidade, Percepções e Influências na Adoção ”, um artigo publicado em 2015, “… os participantes acharam o desbloqueio facial do Android e o desbloqueio da impressão digital do iPhone fáceis de usar em vários cenários de uso comuns”. Por sua própria natureza, os métodos biométricos são mais difíceis de obter pelos invasores do que os métodos de autenticação baseados em conhecimento, como senhas.

Você também não precisa usar apenas a autenticação biométrica. Quando combinada com outros métodos de autenticação, como senha ou link mágico, a autenticação biométrica pode fornecer segurança adicional sem adicionar atrito à experiência do usuário.

Como adicionar funcionalidade biométrica ao seu webapp

A maneira mais fácil de adicionar autenticação biométrica ao seu aplicativo da Web é usar um padrão chamado WebAuthn . Isso é suportado por todos os principais navegadores (exceto IE, desculpe usuários do IE!) e vincula uma API JavaScript amigável a uma variedade de métodos de autenticação baseados em hardware, incluindo opções biométricas suportadas por sistemas operacionais móveis e de desktop.

Um gráfico de CanIUse.com ilustrando quais navegadores da Web suportam a API WebAuthn. Todos os navegadores modernos, exceto IE e Opera Mini, fazem isso. A maioria dos navegadores da Web oferece suporte ao WebAuthn.

Para adicionar autenticação forte baseada em WebAuthn, incluindo opções biométricas, execute as seguintes etapas de alto nível:

  • Verifique se o WebAuthn é suportado usando uma API JavaScript para testar o navegador atual.
  • Solicitar ao usuário que adicione um método de autenticação biométrica
  • Associar o método à conta
  • No próximo login, identifique o usuário de alguma forma
    • Defina um cookie quando eles adicionam o método
    • Peça o nome de usuário
  • Quando você souber quem eles são, solicite um login WebAuthn
  • O autenticador biométrico (o telefone ou sistema operacional) emitirá um desafio de autenticação
  • O usuário responde fornecendo sua impressão digital ou qualquer prova biométrica necessária
  • Seu JavaScript recebe e interpreta uma mensagem do navegador
  • Se a mensagem indicar autenticação bem-sucedida, faça login do usuário

O código real é bastante direto. 

Para confirmar que o navegador suporta WebAuthn, execute este código:

if (window.PublicKeyCredential) {  // do your webauthn stuff} else {  // wah-wah, back to passwords for you}

  Em seguida, para adicionar um método de autenticação biométrica, chame este método JavaScript:

navigator.credentials.create(options);

Para solicitar um login biométrico, use este JavaScript:

navigator.credentials.get(options);

O optionsobjeto é crítico e inclui informações sobre o tipo de credencial que você está solicitando, um nonce que evita ataques de repetição e informações sobre o site solicitante. Detalhes completos são abordados na especificação , mas também abordaremos o optionsobjeto em detalhes abaixo.

Nós temos padrões 

Vale a pena entender os padrões que permitem que um aplicativo da Web aproveite algo como o sistema TouchID do telefone de um usuário para login. Existem três padrões principais que você deve conhecer:

  • WebAuthn, como já mencionado
  • CTAP2
  • FIDO2

WebAuthn também &eacut