Skip to content

Web Components

IDV Web Components provide a browser-based way to run IDV workflows, capture data from users, and send it to the Platform.

This page explains how to add the <idv-flow> component to your web application and load the required scripts using NPM or a CDN.

As a next step, see Starting Session to learn how to configure the integration and start workflows.

Overview

The available component is <idv-flow>.

The component is designed to run IDV workflows, collect data from users, and send it to the Platform.

Before You Start

  • Components require HTTPS — they will not work over plain HTTP.
  • The library automatically registers web components. Import it before adding the components to your HTML.

Content Security Policy (CSP)

If your application uses a Content Security Policy (CSP), make sure it allows the resources required by the Web Components.

The <idv-flow> component can use the @regulaforensics/idv-face and @regulaforensics/idv-document modules, which rely on Web Workers and WebAssembly (WASM). For these to work correctly together with CSP, we recommend adjusting your CSP headers as follows:

script-src 'unsafe-inline' 'unsafe-eval' blob:;
worker-src https://wasm.regulaforensics.com blob:;

For more background on WebAssembly and CSP, see WebAssembly Content Security Policy.

Compatibility

Devices Chrome FireFox Safari
Mobile (iOS) 99 (iOS14.4+) 99 (iOS14.4+) 11
Mobile (Android) 69 63 -
Desktop 66 69 11

Install via NPM

If you are starting a new project, initialize it:

cd /path/to/project
npm init

Install the main package:

npm i @regulaforensics/idv-capture-web

Optionally, install additional modules:

npm i @regulaforensics/idv-face
npm i @regulaforensics/idv-document

Create index.html and index.js files in the root directory of the project.

Import @regulaforensics/idv-capture-web into your index.js:

import './node_modules/@regulaforensics/idv-capture-web/dist/main.js';

In index.html, add the component and load index.js:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>My app</title>
    </head>
    <body>
        <idv-flow></idv-flow>
        <script type="module" src="index.js"></script>
    </body>
</html>

Here is an example of index.js file.

Install via CDN

Use a CDN if you don’t have a build process (for example, a plain HTML/JS project). Add the following script tags to your .html file. The CDN link format is unpkg.com/:package@:version/:file:

<script src="https://unpkg.com/@regulaforensics/idv-capture-web@latest/dist/main.iife.js"></script>

<script src="https://unpkg.com/@regulaforensics/idv-face@latest/dist/main.iife.js"></script>
<script src="https://unpkg.com/@regulaforensics/idv-document@latest/dist/main.iife.js"></script>