FaceAuthenticator
Importando o SDK
Para utilizar o FaceAuthenticator, você pode tanto importar remotamente o arquivo .js
como baixá-lo localmente.
Remotamente
Inclua o arquivo .js
diretamente do CDN:
<script src="https://repo.combateafraude.com/javascript/release/face-authenticator/<VERSION>.umd.js" type="text/javascript"></script>
Você pode recuperar a classe do SDK utilizando o seguinte código:
const { FaceAuthenticatorSdk } = window['@combateafraude/face-authenticator'];
Localmente
Baixe o arquivo .js
e importe-o como um módulo ES6:
import { FaceAuthenticatorSdk } from '../assets/js/face-authenticator-<VERSION>.js'
Construção
No construtor, o SDK recebe um único parâmetro com as configurações:
const sdk = new FaceAuthenticatorSdk(options);
Parâmetros suportados
Os campos sem valor padrão são obrigatórios.
Parâmetro | Obrigatório? |
---|---|
token Token de autenticação para consumir o SDK. | Sim |
language Idioma das mensagens padrões, valores válidos: pt_BR , en_US , es_MX . | Não. O padrão é pt_BR |
environmentSettings.disableDesktopExecution Flag indicando se a execução em desktops deve ser bloqueada. | Não. O padrão é false |
capturerSettings.disableAdvancedCapturing Flag indicando se a captura avançada deve ser desabilitada*. | Não. O padrão é false |
appearenceSettings.captureButtonIcon Customização do ícone de captura, aceita valores como url de imagem ou base64 de svgs. | Não |
appearenceSettings.captureIconSize Customização do tamanho do ìcone referente ao campo captureButtonIcon. | Não |
appearenceSettings.captureButtonColor Customização da cor do botão default de captura de imagem. | Não |
appearenceSettings.switchButtonIcon Customização do ícone de troca de câmera, aceita valores como url de imagem ou base64 de svgs. | Não |
appearenceSettings.switchIconSize Customização do tamanho do ícone referente ao campo switchButtonIcon. | Não |
appearenceSettings.switchIconColor Customização da cor do ícone default de troca de câmera. | Não |
appearenceSettings.fontFamily Altera a fonte de todos os elementos contidos no Sdk. | Não. O padrão é herdado da página |
textSettings.messages.processMessage Customização da mensagem de processamento de imagem. | Não. O padrão é "Processando sua foto, aguarde um momento" |
textSettings.messages.captureFailedMessage Customização da mensagem de falha na captura. | Não. O padrão é "Ops! Tivemos um problema ao processar sua imagem." |
* A captura avançada consiste no uso de APIs mais complexas e não tão estáveis em navegadores que oferecem suporte à mesma (e.g. ImageCapture)
Exemplo
const sdk = new FaceAuthenticatorSdk({
token: `my-sdk-token`,
language: `pt_BR`,
environmentSettings: {
disableDesktopExecution: false,
},
appearenceSettings: {
captureButtonIcon: '',
captureIconSize: '',
captureButtonColor: '',
switchButtonIcon: '',
switchIconSize: '',
switchIconColor: '',
fontFamily: '',
},
capturerSettings: {
disableAdvancedCapturing: false,
},
textSettings: {
messages: {
processMessage: '',
captureFailedMessage: '',
},
}
});
CaptureStage
O CaptureStage permite que o cliente configure as etapas . Para isso, oferecemos o objeto CaptureStage
, onde você pode definir os seguintes parâmetros:
Parâmetro |
---|
mode Modo de captura desejado. Podendo ser utilizado manual ou automatic . Na captura manual, um botão será habilitado para o usuário realizar a captura. |
attempts Quantidade de tentativas do stage atual. Caso seja o único stage deve ser passado o valor 0 . |
duration Tempo de duração do stage atual. Caso seja configurado mais de um stage, pode ser parametrizado o tempo total de cada stage, onde ao atingir o tempo total, será passado ao stage seguinte. Defina como 0 caso não deseje configurar um tempo para o stage. |
Exemplo CaptureStage
const stages =[{mode: 'automatic', attempts: 3, duration: 60}, {mode: 'manual', attempts: 0, duration: 0}];
São definidos objetos para cada estágio, conform exemplo, o SDK iniciará com a captura automática, onde vão ser efetuadas 3 tentativas de captura ou então o tempo limite de 60 segundos para cada tentativa, após exceder o tempo ou as tentativas, o SDK seguirá automaticamente para o próximo estágio, onde seria realizada a captura manual sem limite de tentativas ou tempo, então o usuário pode efetuar quantas tentativas quiser sem limite de tempo.
Limitar tentativas do SDK
Através do parâmetro totalAttempts
, é possível configurar o total de tentativas de execução do SDK, após atingir o valor limite o SDK encerrará automaticamente.
Exemplo totalAttempts
await sdk.capture(sdkContainer, stages, {personData, totalAttempts: 3});
Inicialização
initialize(): Promise<void>
O SDK conta com um método isolado de inicialização, para permitir um maior controle de quando ela ocorre.
Durante esse processo, o SDK irá inicializar suas variáveis internas e fazer download dos recursos necessários para sua execução.
[!] Você deve chamar este método antes de utilizar outros métodos do SDK.
[!] A inicialização do SDK pode levar alguns segundos. Recomendamos que você chame essa função o mais cedo possível no seu fluxo, para que a abertura do SDK seja suave para o usuário.
Utilização
Abertura e captura de selfie
capture(container: HTMLElement, stages, {personData?: PersonData, totalAttempts?: Number}): Promise<Result>
Método utilizado para carregar o SDK na tela e realizar a capture de selfie.
Irá inicializar a stream de vídeo (solicitando permissões se necessário) e carregá-la no container.
Parâmetros
Parâmetro | Tipo |
---|---|
personData.cpf CPF do usuário fazendo a autenticação (obrigatório). | string |
personData.name Nome do usuário fazendo a autenticação (opcional). | string |
¹ Se não especificado, a captura automática é utilizada.
² Se não especificado, usa-se um valor padrão de 30 segundos.
Exemplo
// div or another element on DOM
const sdkContainer = document.getElementById('sdk-displayer');
const personData = { cpf: 'user-cpf', name: 'user-name' };
await sdk.capture(sdkContainer, stages, {personData, totalAttempts});
Retorno
O retorno consiste em um objeto com o seguintes campos:
Campo | Tipo | Descrição |
---|---|---|
requestId | string | Identificador único da requisição |
isMatch | boolean | Boolean indicando se o rosto capturado é idêntico ao rosto registrado para o peopleId informado |
peopleId | string | Informação do documento informado para autenticação |
openEyesProbability | number | Probabilidade de os olhos estarem abertos na selfie capturada |
Fechar SDK
close(): Promise<void>
Método utilizado para remover o SDK na tela.
De-inicializar o SDK
dispose(): Promise<void>
Método utilizado para remover o SDK na tela.
Irá de-inicializar a stream de vídeo e limpar as variáveis internas do SDK
Exemplo completo
Em breve.