You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP
Socket
Book a DemoInstallSign in
Socket

@id3/kyc

Package Overview
Dependencies
Maintainers
2
Versions
5
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@id3/kyc

This component offers the following features: - Live capture or from gallery import of Columbian identity documents thanks to Blink ID in browser SDK. - Liveness detection from a camera thanks to id3 Face PAD web component. - A face match process between

2.1.0
latest
npmnpm
Version published
Maintainers
2
Created
Source

Id3 KYC - Angular web component

This component offers the following features:

  • Live capture or from gallery import of Columbian identity documents thanks to Blink ID in browser SDK.
  • Liveness detection from a camera thanks to id3 Face PAD web component.
  • A face match process between the ID card photo and the photo captured during liveness detection.
  • Display of ID card information.

You can find a live demo here

Table of content

Integration instructions

Authentication requirements

An API key, an API url and a Blink ID license key are required to use this web component.

Web component authentication

The authentication process shall be performed from the application backend to avoid making the API key in website source code.

The authentication process consists in the following steps:

  • The front-end application calls the application back-end for a temporary authentication token.
  • Call to API /authenticate from the back-end with the API Key
     POST Request
     Url : api_url/authenticate
     Body (json): { "key" : "$your_api_key_to_insert_here" }
     Response (json) : { "bearerToken" : "the_generated_token_to_give_to_the_web_component" }
    
  • The application backend transmit the bearer token to the application front-end.
  • Set the Bearer Token to the attribute authorization of the web component.

Installation

npm i @id3/kyc --save

Usage

The web component can be imported into an Angular application using the following code instruction:

import { Id3KycModule } from '@id3/kyc';

Then, the Id3KycModule has to be imported in the app.module.ts file:

...
imports: [
    ...,
    Id3KycModule,
    ...
],
...

Assets

The Kyc component uses images and Microblink SDK contained in its assets folder. So, glob patterns have to be included in the assets section of the build section of the angular.json file:

...
"assets": [
    {
        "glob": "**/*",
        "input": "node_modules/@id3/kyc/assets/",
        "output": "/assets/"
    },
    {
        "glob": "**/*",
        "input": "node_modules/@microblink/blinkid-in-browser-sdk/resources/",
        "output": "/assets/lib/"
    }
    ...
],
...

Apply styles

The component uses bootstrap for theming, so that bootstrap css and js and jquery js have to be included in the style and script sections of the build section of the angular.json file:

... 
"styles": [
    "node_modules/bootstrap/dist/css/bootstrap.min.css",
    ...
],
"scripts": [
    "node_modules/jquery/dist/jquery.min.js",
    "node_modules/bootstrap/dist/js/bootstrap.min.js",
    ...
]
...
Minimal example

The Id3 KYC web component hasto be added into an html page or a template file:

<id3-kyc 
    [authorization]="$apiKey"
    [apiUrl]="$apiEndpoint"
    [language]="$language"
    [blinkIdLicenseKey]="$blinkIdLicenseKey"
></id3-kyc>

Properties

NameTypeDefaultDescription
authorizationstringdefaultBearer token returned by the authentication process
apiUrlstringdefaultBase URL of the API
languageLanguageSupportedTypeSet the language manually (LanguageSupportedType = 'en' | 'fr' | 'es'). If the parameter is not filled in and the browser language is not supported, spanish is used.
blinkIdLicenseKeystringBlink ID license key

Events

NameParametersDescription
startEventCallback invoked when the process is started.
endEventDocument information and match decisionCallback invoked when the process is done.
cancelEventCallback invoked on cancel button click.
authTimeOutHandlerCallback invoked on secured session invalid. Authorization token has to be renewed by authenticating to the API.

Exemple of information returned by endEvent:

{
    biographics: {
        NUIP: "__",
        lastNames: "__",
        firstNames: "__",
        particle: "__",
        sex: "__"
    },
    faceMatch: boolean
}

FAQs

Package last updated on 27 Sep 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts