How to Integrate KYC in minutes?

How to integrate Hypersign KYC in your test environment

Staging Widget Base URL : https://verify.hypersign.id

Staging KYC Server Base URL: https://ent-4c71874.api.cavach.hypersign.id

Hypersign KYC Widget integration

The Hypersign KYC widget can be configured and incorporated in just a few minutes. You'll need to generate a Widget URL and insert it into a DOM element. Additionally, you can monitor events triggered by the widget on your webpage to showcase either success or failure. Once the user completes the KYC process successfully, you'll receive an idToken, which can be utilised to request the user's data/credentials from the KYC server.

Forming Widget URL

The Widget URL has three query params:

  1. kycAccessToken: KYC Access Token

  2. ssiAccessToken: SSI Access Token

The final Widget URL format would look something like this:

https://verify.hypersign.id?kycAccessToken=${kycAccessToken}&ssiAccessToken=${ssiAccessToken}

1. KYC Access Token

Kindly contact Hypersign Admin.

2. SSI Access Token

Kindly contact Hypersign Admin.

Invoking the widget

You can invoke the Hypersign KYC widget through popup from your page

const widgetUrl = `https://verify.hypersign.id
?kycAccessToken=${kycAccessToken}&ssiAccessToken=${ssiAccessToken}`

window.open(widgetUrl, 'Popup Window', 'width=850,height=870');

Listening to events

You can listen to events thrown by the widget to get the result of verification.

window.addEventListener('message', function (event) {
    if (event.origin === 'https://verify.hypersign.id') {
        console.log('Received message from popup:', event.data);
        // make sure to parse the data before use
        const data = JSON.parse(event.data)
        
        // we send these 3 vaules: 
        // status = success / fail, 
        // idToken = you will use this token to extract user's data
        // message = a simple message (if any)
        const { status, idToken, message} = data;
        if (status === 'success') {
            console.log('Successfully finished the KYC')
        }
        else if (status === 'fail') {
            console.log('Failed to finish KYC')
        }
    }
});

Extracting User Data

Once you receive the idToken, you can query the KYC service to extract user data.

User Data Request

GET {kyc_server_base_url}/api/v1/e-kyc/verification/user-consent

kyc_server_base_url: https://ent-4c71874.api.cavach.hypersign.id

Headers

Name
Value

Content-Type

application/json

Authorization

Bearer <kycAccessToken>

Response

{
  "@context": [
  ],
  "type": ["VerifiablePresentation"],
  "VerifiableCredntial": [
      {
        ... 
      }
  ]
}
https://ent-4c71874.api.cavach.hypersign.id/api/v1/e-kyc/verification/user-consent?idToken=${idToken}

Demo

Try LIVE Demo Now: https://hypersign-kyc-demo.netlify.app/

Last updated