Introducing VIDA Identity Stack: All of VIDA, in one place 🎉
Ctrlk
Go to VIDABook a Demo
For the complete documentation index, see llms.txt. This page is also available as Markdown.

Installations

The Vida Web SDK offers two integration methods.

Note: The library is Browser only, it does not support the Node Context.

1. Integration via Script Tag

The quickest and simplest way to integrate the Vida Web SDK is to use the package hosted via Vida as a script tag. You can include the SDK in your application by adding the script tag directly to your index.html file or dynamically using JavaScript.

Add the following script tag for testing and POC purposes:

Use the following script tag for production applications:

Replace <VERSION> with the latest version provided to you (e.g., 1.1.0).

About Versioning

Vida Web SDK follows semantic versioning, a widely used versioning convention that ensures clear communication about the compatibility and changes in the software. Semantic versioning uses a MAJOR.MINOR.PATCH format:

Format
Description

MAJOR

Introduces significant changes that may not be backward compatible.

MINOR

Adds new features while maintaining backward compatibility.

PATCH

Includes bug fixes and minor updates without changing existing features or compatibility.

2. Integration via NPM Package

You can integrate the Vida Web SDK into your application as an npm package. This approach is ideal for modern web development workflows and allows better management of dependencies. TypeScript is officially supported in Vida web SDK npm package.

To install the SDK, use either of the following commands based on your package manager:

For Yarn

For NPM

Starting from v1.2.0 - A single package is published for all environments. Select your target environment at runtime by passing the env option to init():

For earlier version in sandbox , use the version with suffix sandbox.

This method ensures that the SDK is included in your project's node_modules directory, making it easy to manage and update.

Update Content Security Policy (CSP) Whitelist & Network Whitelist

To ensure seamless functionality of the Vida Web SDK, update your Content Security Policy (CSP) and network whitelist to allow the following resource:

script-src

'wasm-unsafe-eval' is required for face detection (WebAssembly).

Additional CSP Directives (Only required if you have these directives enforcement)

The SDK also makes API calls and loads additional resources based on the workflow configs. Add the following to your connect-src and img-src.

Production Env

Note: https://shield.vida.id & https://pixel-shield.vida.id are required only if you have ID Fraud shield enabled

https://vida-prod-tijori-1.s3.ap-southeast-3.amazonaws.com is required only if you have liveness color flash enabled

Sandbox Env

Note:https://sandbox-shield.vida.id & https://sandbox-pixel-shield.vida.id are required only if you have ID Fraud shield enabled

https://vida-sandbox-tijori-1.s3.ap-southeast-3.amazonaws.com is required only if you have liveness color flash enabled

Tip: You can use https://*.vida.id in place of individual subdomains if your policy allows wildcards. The Grafana collector ( used for error/crash logging ) and the S3 upload hosts ( used only for color flash ) must always be added explicitly.

Network / Firewall Whitelist

Allow outbound HTTPS (port 443) to: (only needed if SDK is used in an environment that enforces egress filtering or outbound firewall rules)

Tip: Use *.vida.id to cover all Vida-owned hosts with a single rule. The Grafana collector and the S3 upload host must still be whitelisted explicitly.

No inbound ports are required. If TLS inspection is enabled, exclude these hosts to avoid certificate failures.

PreviousEnvironment
NextAuthentication

Last updated