zinid-js

zinid-js

A universal signin and KYC verification SDK for ZinId

💾 Installation

npm install zinid-js

📄 Usage

This library provides a global object called zinIdAuth, which can be used in any javascript application for sign in and KYC verification by using the functions exported with the zinIdAuth object. The library can be implemented via npm and CDN, the guide below contains demo implementations via npm, See the documentation page of the zinId website for demo CDN implementations.

1. Signin

The sign in can be implemented via two different functions, one being the createSigninButton and the other being the initializeSignIn method.

Creating a Sign-In Button

The createSigninButton method returns a custom zinId signin button which will be appended to the container if provided. It is recommended to provide an element as the container, but if no element is provided, You can append the returned button to an element.

// Using npm module
import zinIdAuth from 'zinid-auth';

// Create a ZinId sign-in button with default ZinId style and append it to a container
const button = zinIdAuth.createSigninButton({
  sdkToken: 'YOUR_SDK_TOKEN',
  container: '#button-container',
  onSuccess: (data) => {
    console.log('Successfully authenticated:', data);
  }
});

Initializing Sign-In Programmatically Without using the custom ZinId Signin button

zinIdAuth.initializeSignIn({
  sdkToken: 'YOUR_SDK_TOKEN',
  onSuccess: (data) => {
    console.log('Successfully authenticated:', data);
  }
});

2. KYC verification

The KYC verification can be implemented via two different functions, one being the createVerifyButton and the other being the initializeVerify method.

Creating a Verify Button

The createVerifyButton method returns a custom zinId verify button which will be appended to the container if provided. It is recommended to provide an element as the container, but if no element is provided, You can append the returned button to an element.

// Using npm module
import zinIdAuth from 'zinid-auth';


// Create a ZinId Verify button with default ZinId style and append it to a container
const button = zinIdAuth.createVerifyButton({
  sdkToken: 'YOUR_SDK_TOKEN',
  container: '#button-container',
  onSuccess: (data) => {
    console.log('Successfully verified:', data);
  }
});

Initializing KYC Verification Programmatically Without using the custom ZinId Verify button

zinIdAuth.initializeVerify({
  sdkToken: 'YOUR_SDK_TOKEN',
  onSuccess: (data) => {
    console.log('Successfully verified:', data);
  }
});

API Reference

1. Signin

zinIdAuth.createSigninButton(options)

Creates a "Sign in with ZinId" button with default ZinId style and optionally appends it to a container if provided.

🪄 Parameters for the sign in button

• options (Object): Configuration options
  • sdkToken (string): Your SDK token for authentication
  • text (string, optional): Button text. Defaults to "Sign in with ZinId"
  • className (string, optional): Additional CSS classes for the button
  • disabled (boolean, optional): Whether the button is disabled
  • container (string|Element, optional): Container to append the button to.
  • onSuccess (Function, optional): Callback for successful authentication

Returns

• (HTMLElement): The created button element

zinIdAuth.initializeSignIn(options)

Initiates the sign-in process programmatically. Parameters

• options (Object): Configuration options
• sdkToken (string): Your SDK token for authentication
• onSuccess (Function, optional): Callback for successful authentication

2. Verify

zinIdAuth.createVerifyButton(options)

Creates a "Verify with ZinId" button with default ZinId style and optionally appends it to a container.

🪄 Parameters for the sign in button

• options (Object): Configuration options
  • sdkToken (string): Your SDK token for authentication
  • text (string, optional): Button text. Defaults to "Verify with ZinId"
  • className (string, optional): Additional CSS classes for the button
  • disabled (boolean, optional): Whether the button is disabled
  • container (string|Element, optional): Container to append the button to
  • onSuccess (Function, optional): Callback for successful authentication

Returns

• (HTMLElement): The created button element

zinIdAuth.initializeVerify(options)

Initiates the KYC verification process programmatically. Parameters

• options (Object): Configuration options
• sdkToken (string): Your SDK token for authentication
• onSuccess (Function, optional): Callback for successful authentication