Web integration guide

Updated on 10.07.25

1 minute to read

Copy link

Check out the npm package

@seontechnologies/seon-id-verification

Setup and installation

Install the Package

Run the following command in your project directory:

npm install @seontechnologies/seon-id-verification

Import Necessary Files

Import the service and associated styles in your code:

import { SeonIdVerificationService } from '@seontechnologies/seon-id-verification';
import '@seontechnologies/seon-id-verification/styles';

Ensure TypeScript Compatibility (Optional)

If using TypeScript, declare custom elements globally to avoid errors:

declare global {
    interface HTMLElementTagNameMap {
        'seon-id-verification': HTMLElement;
    }
}

Configuration

Create a configuration object tailored to your application's requirements. Example:

const config = {
  baseUrl: 'https://idv-eu.seon.io',    // alternatively: 'https://idv-us.seon.io'
  language: 'en',                       // Language (optional, ISO code)
  SEONCustomerData: {
    licenseKey: 'YOUR_LICENSE_KEY',     // IDV License Key (required)
    templateId: 'TEMPLATE_UUID',        // Template applied on the session
    referenceId: 'UNIQUE_REFERENCE_ID', // Random unique value for the session
                                        // e.g. UUID, or {userID}-{timestamp} (required)
    email: 'user@example.com',          // Email input (optional)
    name: 'John Doe',                   // Name input (optional)
    phoneNumber: '+1234567890',         // Phone number input (optional)
    type: 'id-verification',            // Process type (optional)
    userId: 'user123',                  // Unique user identifier (optional)
    countryISOCode: 'US',               // ISO code for the country (optional)
    address: '123 Main St, NY',         // Address input (optional)
    dateOfBirth: {                      // Reference date for the DoB check (optional)
      day: 1,
      month: 1,
      year: 2000,
    },
    postalCode: '12345',                // Reference value for postal check (optional)
    additionalProperties: {             // Custom key-value pairs (optional)
      customField1: 'value1',
      customField2: 'value2',
    },
  },
};

See more input details on the Session Input Config page.

Initialization and Event Listeners

Initialize the Service

Call the initialize method with the configuration object:

SeonIdVerificationService.initialize(config)
  .then(() => {
    console.log('SEON ID Verification Service initialized.');
  })
  .catch(err => {
    console.error('Initialization error:', err);
  });

Set Up Event Listeners

SeonIdVerificationService.on('start', () => console.log('Verification started.'));
SeonIdVerificationService.on('completed', () => console.log('Verification completed:'));
SeonIdVerificationService.on('error', err => console.error('Error occurred:', err));

Start the Verification Process

Once the service is initialized and listeners are set up, trigger the verification process:

SeonIdVerificationService.start();
For React, include a button for users to start the process interactively:
<button onClick={() => SeonIdVerificationService.start()}>Start Verification</button>