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.

Integration

Sequence Diagram - ID Fraud Shield Web SDK Flow

Environments and Testing with the SDK

Two environments exist to support the Vida Web SDK integrations:

  • 'sandbox' - to be used for testing and POC

  • 'production' - to be used only in production apps

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.0.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 ID Fraud Shield 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.

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

For Yarn

For NPM

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

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

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

The SDK also makes API calls and loads pixel resources. Add the following to your connect-src and img-src.

Tip: You can use https://*.vida.id in place of individual vida.id subdomains if your policy allows wildcards. The Grafana collector ( used for error/crash logging ) 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 must still be whitelisted explicitly. No inbound ports are required. If TLS inspection is enabled, exclude these hosts to avoid certificate failures.

PreviousWeb SDK
NextAuthentication

Last updated