Biometric ID - SDK Web¶

En este documento encontrará una explicación de cómo se realiza la integración con el SDK Web BiometricID

Pre requisitos¶

Para hacer uso del SDK se debe contar con un Api Key válido: {{ API_KEY }} y un correo de usuario creado desde el selfservice: {{ USUARIO_SELFSERVICE }}

Para hacer uso del lector de huellas debe contar con el SDK correspondiente instalado

Se debe tener en cuenta que los tipos de documento que aparecerán para consulta serán los que estén habilitados en el tipo de suscripción al que pertenece el cliente del Selfservice, en caso de no tener algúno habilitado entonces comunicarse con el administrador

Definiciones¶

Nombre	Descripción
{{ URL_SDK }}	https://websdkbiometricid.racsa.go.cr
{{ CLIENTE_ID }}	Identificador del cliente

Crear un Api Key¶

Para usar el sdk se necesita tener un api key válido {{ API_KEY }}, en caso de que tengas uno omite este paso

Inicia sesión en el selfservice con tus credenciales
Da click en la sección de Api Keys
Da click agregar apikey
Ingresa un nombre y selecciona el tipo sdk web, por último escribe los dominios autorizados separados por coma

Obtener el identificador del cliente¶

Para usar el sdk se necesita tener el id del cliente {{ CLIENTE_ID }}, en caso de que tengas uno omite este paso

Inicia sesión en el selfservice con tus credenciales
Da click en la sección de Api Keys
Da click en el botón "Copiar cliente id"

Integración del sdk web¶

Paso 1¶

En el html definimos un iframe y le asignamos la {{ URL }} del sdk y el id del cliente

<iframe id="sdkFrame" class="sdk" src="{{ URL_SDK }}?id={{ CLIENTE_ID }}" frameborder="0" allow="camera 'src'"></iframe>

Ejemplo de como quedaría:

<iframe id="sdkFrame" class="sdk" src="https://websdkbiometricid.racsa.go.cr?id=abcdefghijk" frameborder="0" allow="camera 'src'"></iframe>

Paso 2¶

Creamos un script que iniciará el iframe index.js

let frameId = 'sdkFrame';
document.getElementById(frameId).onload = function () {
    var msg = {
        apiKey:”{{ API_KEY }}”,
        userEmail:”{{ USUARIO_SELFSERVICE }}”
    };
    this.contentWindow.postMessage(msg,this.src);
};

Paso 3¶

Cargar el script al html al final del body

<script src="index.js"></script>