Installing Face Recognition

1 Install Server Configuration

First, make sure you have the right application dependencies installed and configured. Go to the physical location of the site (Portal or B2C Portal) and follow the instructions below:

Portal/ B2C Portal web.config <appSettings> section, configuration

If you have a generic key for all the services, add the following keys in web.config - <appSettings>:

Copy

<add key="FTOSServicesEndpoint" value="get-the-url-from-portal"/>
<add key="FTOSServicesAppId" value="get-the-key-from-portal"/>

If you have different subscription keys for each of the services you must add the following keys in web.config - <appSettings>:

OCR Microsoft Azure provider

Copy

<add key="FTOSServicesOCR2Endpoint" value="get-the-url-from-portal"/>
<add key="FTOSServicesOCR2AppId" value="get-the-key-from-portal"/>

Face Recognition

Copy

<add key="FTOSServicesFaceEndpoint" value="get-the-url-from-portal"/>
<add key="FTOSServicesFaceAppId" value="get-the-key-from-portal"/>

Video

Copy

<add key="FTOSServicesVideoFaceEndpoint" value="get-the-url-from-portal"/>
<add key="FTOSServicesVideoAppId" value="get-the-key-from-portal"/>

FaceRecognition With Liveness

Copy

<add key="FTOSServicesLivenessEndpoint" value="get-the-url-from-portal"/>
<add key="FTOSServicesLivenessAppId" value="get-the-key-from-portal"/>

Custom Folder
For each installed Portal (B2C or BackOffice) that will use the cognitive video components, copy the Custom For FintechOS Portal\custom and Custom For FintechOS Portal\custom-on-demand folders from the Cognitive Processor pack in the application - portal web application root folder.

Copy to UploadEBS

Add the following images to the Upload EBS folder <portal_EBS_folder>:

Copy

<syspack_file_path>\10 Cognitive Processor Operator - Vxx.x.xxxx \CopyToUploadEBS\emptyOCR.jpg

<syspack_file_path>\10 Cognitive Processor Operator – Vxx.x.xxxx\CopyToUploadEBS\emptyPhoto.png

In IIS
The following MIME Types must be added on the sites where the SDK was previously added:
- . with type text/xml
- .data with type text/xml
- .wasm with type application/wasm

2 Install Application Configuration

Log into Innovation Studio, Developer profile, and follow the instructions below:

Import Packs
Go to DevOps > Deployment Packages, and import the received packs. The Cognitive Processor pack contains the services configuration model and scripts for OCR, Face Recognition and Video.
Import data
Go to Evolutive Data Core > Data Import Template. Select the template and import using the xlxs data in the packages:
- Import_01_FTOS_DFP_FlowSettings:
  Copy
```
- Import_01_FTOS_DFP_FlowSettings.xlsx
```
- Import_FTOS_DFP_ProcessorSettings:
  Copy
```
- Import_02_FTOS_DFP_ProcessorSettings.xlxs
```
Custom Setting
Go to Admin > Settings. Check the Use Custom Styles box. Click Save and close.

Log into the Portal.

NOTE For the OCR, Face Recognition, and Video components to work, the sites must run on HTTPS.

OCR Configuration

For configuring the OCR, select Digital Flow Processing > Flow Settings.

You have 2 flows as examples for OCR Romanian IDs: - " 2 OCR Flow Setting Example ". Here you can find examples of usage, and these processor settings are used by the “Example OCR Pack” from the package. It’s an example for 2 step OCR (if your flow has 2 OCR steps in it).

OCR_1 - Reads an area of the ID.

OCR_2 - Reads a different area of the ID.

NOTE You can copy the examples and modify them.

In the Example Flow Setting, you can find a full IdRom setting, and mapping examples for edit and insert forms. For other types of OCR: Driving Licence, Passport, IdBG, the examples are the same.

In The Processor Setting, change in the Setting field from DocumentType:IdRom (the last entry) to one of the types available in the list: AvailableDocumentTypes above DocumentType.

Change the mapping as well, with the data received after calling the OCR service.

Example

This is applicable to Example Flow Setting.

Client script on edit mode form

To start the OCR component, use the loadComponent function from the FTOS.DFP library: loadComponent(componentName, processorSettings, recordId, existingFile).

Copy

var dfpHelper = ebs.importClientScript('FTOS.DFP'); 
var componentName = 'FTOS_DFP_OCR'; //name of the component

var recordId = formData.id; 
var flowSettingsName = formData.FlowSettings; 

var p = {}; 
var accountApplicationId = recordId; 
p.accountApplicationId = accountApplicationId; 
p.toStatus = "OCR in Progress"; 
ebs.callActionByName("FTOS_BARET_AccountApplication_BusinessWorkflow", p, 
function(e){ 

    var params = {}; 
    params.flowSettingsName = flowSettingsName; 
    params.processorSettingsType = 'OCR'; 
    params.processorSettingsName = 'OCR_CurrentAccount'; 
    
    ebs.callActionByName("FTOS_DFP_FlowProcessorSettingsByType", params, 
    
function(f)
    { 
        var processorSettingsId = f.UIResult.Data.ProcessorSettingsId; 
        dfpHelper.loadComponent(componentName, processorSettingsId, recordId, false); 
        }); 
        
});

Client script on insert mode form

To start the OCR component, use the loadComponent function from the FTOS.DFP library: loadComponent(componentName, processorSettings, recordId, existingFile). The recordId parameter is null, as we are running the component from a form in insert mode.

Copy

var dfpHelper = ebs.importClientScript('FTOS.DFP'); 
var componentName = 'FTOS_DFP_OCR'; //name of the component 

var flowSettingsName = formData.FlowSettings; 

var p = {}; 
var accountApplicationId = recordId; 
p.accountApplicationId = accountApplicationId; 
p.toStatus = "OCR in Progress"; 
ebs.callActionByName("FTOS_BARET_AccountApplication_BusinessWorkflow", p, 
function(e){ 
    var params = {}; 
    params.flowSettingsName = flowSettingsName; 
    params.processorSettingsType = 'OCR'; 
    params.processorSettingsName = 'OCR_CurrentAccount'; 
    
    ebs.callActionByName("FTOS_DFP_FlowProcessorSettingsByType", params, 
function(f) 
    { 
        var processorSettingsId = f.UIResult.Data.ProcessorSettingsId; 
        dfpHelper.loadComponent(componentName, processorSettingsId, null, false);
    }); 
});

After the OCR process ends, the results are returned in sessionStorage in an item called ocrResult. After reading the results, we recommend to remove the object. It will be also removed when a new OCR component is instantiated.

Copy

var ocrResult = sessionStorage.getItem("ocrResult"); 
ocrResult = JSON.parse(ocrResult); 

if (ocrResult) { 
    ebs.setFormAttributeValue("ebsContainerContent", "LastName", ocrResult.updateObject.LastName); 
    ebs.setFormAttributeValue("ebsContainerContent", "FirstName", ocrResult.updateObject.FirstName); 
    sessionStorage.removeItem("ocrResult"); 
    };

NOTE The Result of OCR execution will be saved in this entity: FTOS_DFP_OCR.

Face Recognition Configuration

For configuring Face Recognition, select Digital Flow Processing > Flow Settings. You have 1 flow as an example for Face Recognition.

Example

Javascript code - After Events

Copy

var componentName = "FTOS_DFP_FaceRecognitionLiveness"; //name of the component 
    var recordId = ebs.getCurrentEntityId(); 
    var fileExists = true; //"pictureOcr" argument = source entity file attribute 
    var dfpHelper = ebs.importClientScript('FTOS.DFP'); 
    var flowSettingsName = formData.FlowSettings;

    var p = {}; 
    p.accountApplicationId = recordId; 
    p.toStatus = "Face Recognition in Progress";
    
    ebs.callActionByName("FTOS_BARET_AccountApplication_BusinessWorkflow", p, 
function(e){

        var params = {}; 
        params.flowSettingsName = flowSettingsName; 
        params.processorSettingsType = 'FaceRecognition'; 
        params.processorSettingsName = 'FaceRecognitionLiveness_Example';
        
        ebs.callActionByName("FTOS_DFP_FlowProcessorSettingsByType", params, 
function(f)
            { 
                var processorSettingsId = f.UIResult.Data.ProcessorSettingsId; 
                console.log("processorSettingsName " + processorSettingsId); 
                dfpHelper.loadComponent(componentName, processorSettingsId, recordId, fileExists); 
            }); 
    });

NOTE The Result of Face Recognition execution will be saved in this entity: FTOS_DFP_FaceRecognition.

Video Configuration

NOTE Make sure you have imported the second pack as well: Cognitive Processor Operator pack.

For the configuration of Video Configuration, select Digital Flow Processing -> Flow Settings . You have 1 flow as an example for Video.

NOTE You can copy the examples and modify them.

3 Upgrade Application Configuration

Import the Packs Again
Go to DevOps > Deployment Packages, and import the received packs. The 01_FTOS_DFP_OCR_FR pack contains the services configuration model and scripts for OCR, Face Recognition.
Modify the Data
Import the data from FTOS_DFP_OCR_FR .xlxs files.
- Import_01_FTOS_DFP_FlowSettings:
  Copy
```
- Import_01_FTOS_DFP_FlowSettings.xlsx
```
- Import_FTOS_DFP_ProcessorSettings:
  Copy
```
- Import_02_FTOS_DFP_ProcessorSettings.xlxs
```
Using the example, please adapt your processors settings with the new structure found in the new examples.

NOTE For the OCR, Face Recognition, and Video components to work, the sites must run on HTTPS.