@andy.pelaez/identity-verification-ocr v0.1.2-alpha

identity-verification-ocr

This module uses Tenssorflow.js and OpenCV library to process images and provides accesibility to manipulate the images and detect if they are valid IDs.

How to use it?

You should import the openCv Library using the OpenCv documentation or using this package: @techstark/opencv-js, please, read the documentation of the package you going to use.

For @techstark/opencv-js:

• import cv from "@techstark/opencv-js" // OR
• import * as cv from "@techstark/opencv-js"// for Angular

Then create an OpenCV instance using OpenCvOCR class or the singleton instance as follows:

import {OpenCvOCR,openCVInstance} from '@andy.pelaez/identity-verification-ocr';
import * as cv from '@techstark/opencv-js';


export class OpenCvService {

openCv!: OpenCvOCR;

constructor(){
    this.load();
}
  async load() {
    await this.openCvLoad();
 }

 async openCvLoad() {
    return new Promise((resolve) => {
      //This Method waits for initialization of the library and creates the instance.
      //@ts-ignore
      cv.onRuntimeInitialized = () => {
        this.openCv = openCVInstance.getInstance(cv);
        resolve('');
      };
    });
  }
}

You need to extract and store the tensorflow models and the opencv-face-detector file in your public folder to serve them LINK.

It is necessary to specify models like this example

Note: If you specify the files in the models, they will be preloaded and will show you the progress.

To analyze identity images you can use ImageProcessingWorker as follows:

import { ImageProcessingWorker } from '@andy.pelaez/identity-verification-ocr';

 const imageWorker = new ImageProcessingWorker(
        DET_CONFIG.db_mobilenet_v2,
        RECO_CONFIG.crnn_vgg16_bn,
        this.opencvService.openCv
      );

      const minFaceSize = {
        width: environment.imageSizeBlurDetection.width / 5,
        height: environment.imageSizeBlurDetection.height / 5,
      };

        //You should specify where is haarcascade_frontalface_default.xml after serve it
      const faceDetectionOptions: FaceDetectionData = {
        cvFilePath: 'haarcascade_frontalface_default.xml',
        url: 'assets/haarcascade_frontalface_default.xml',
        minFaceSize,
      };

    //This is the minimum percentage value to match with the image.
      const ocrOptions: OCROptions = {
        minMatchPercent: environment.ocrMinPercentageMatch,
      };

    //Return if the image is valid or not
    // Plase try with different image sizes for better results
     const isValid = await imageWorker.processImage(
        this.ocrImageSource as string, // --> the image to recognize the text
        this.blurDetectionImageSource as string, // --> the image to detect the text
        this.form.value, // --> values
        faceDetectionOptions,
        ocrOptions,
        (state) => {
          console.log(state)
        }
      );

You also can use TensorflowWorker to extract the text from an image

 import { TensorflowWorker } from '@andy.pelaez/identity-verification-ocr';

const tensor = new TensorflowWorker(
      DET_CONFIG.db_mobilenet_v2, // --> Tensorflow Detection Model
      RECO_CONFIG.crnn_vgg16_bn, // --> Tensorflow Recognition Model
      this.opencvService.openCv // --> OpenCvOCR instance
    );

    const words = await tensor.recognize(this.ocrImageRef?.nativeElement) // Returns the extracted words