Web SDK Guide

Leverage our UX-optimised Web SDK to quickly verify your clients.

The ComplyCube Web SDK provides a UX-optimised UI that guides your clients via our simple verification process. For video capture, clients must complete a randomized challenge, including the recital of some digits and performing a simple action.

Integration at a glance

Our Web SDK is quick to integrate and can be quickly dropped into your web application in 2 simple steps:

1. Generate an SDK Token

Tokens enable clients to send personal data to ComplyCube via our SDKs securely. Use the generate token endpoint to obtain an SDK token and initialize the Web SDK next.

curl -X POST https://api.complycube.com/v1/tokens \
     -H 'Authorization: <YOUR_API_KEY>' \
     -H 'Content-Type: application/json' \
     -d '{
          "clientId":"CLIENT_ID",
          "referrer": "https://www.example.com/*"
        }'

const { ComplyCube } = require("@complycube/api");

const complycube = new ComplyCube({ apiKey: "<YOUR_API_KEY>" });

const token = await complycube.token.generate("CLIENT_ID", {
    referrer: "https://www.example.com/*"
});

from complycube import ComplyCubeClient

cc_api = ComplyCubeClient(api_key='<YOUR_API_KEY>')

token = cc_api.tokens.create('CLIENT_ID','https://www.example.com/*')

 use ComplyCube\ComplyCubeClient;

$ccapi = new ComplyCubeClient('<YOUR_API_KEY>');

$report = $ccapi->tokens()->generate('CLIENT_ID', 'https://www.example.com/*');

using ComplyCube.Net;
using ComplyCube.Net.Resources.SDKTokens;

var sdkTokenApi = new SDKTokenApi(new ComplyCubeClient("<YOUR_API_KEY>"));

var sdkTokenRequest  =  { clientId = "CLIENT_ID" , 
                        referrer = "https://www.example.com/*" }

var sdkToken = await sdkTokenApi.GenerateToken(sdkTokenRequest);

2. Mount the SDK

To mount our Web SDK, you need to include it on your target page, as shown below.

<!DOCTYPE html>
<html>

  <head>
    <!-- Importing the Javascript library -->
    <script src="complycube.min.js"></script>
    
    <!-- Importing the default CSS -->
    <link rel="stylesheet" href="style.css" />
  </head>
  
  <script>
    var complycube = {};
    function startVerification() {
      complycube = ComplyCube.mount({
        token: "<YOUR_WEB_SDK_TOKEN>",
        onComplete: function(data) {
          console.log("Capture complete", data)
        },
      });
    }
  </script>
  
  <body>
    <!-- This is where the Web SDK will be mounted -->
    <div id="complycube-mount"></div>

    <!-- Clicking the button will start the ComplyCube verification UI -->
    <button onClick="startVerification()">Start verification</button>
  </body>
  
</html>

The links to complycube.min.js and style.css can be found in your developers portal.

Next steps

Follow our detailed Web SDK integration guide to explore the features and customizations it offers.

PreviousSend verification link to client NextWeb SDK integration guide

Last updated 8 months ago

Integration at a glance

Our Web SDK is quick to integrate and can be quickly dropped into your web application in 2 simple steps:

1. Generate an SDK Token

Tokens enable clients to send personal data to ComplyCube via our SDKs securely. Use the generate token endpoint to obtain an SDK token and initialize the Web SDK next.

curl -X POST https://api.complycube.com/v1/tokens \
     -H 'Authorization: <YOUR_API_KEY>' \
     -H 'Content-Type: application/json' \
     -d '{
          "clientId":"CLIENT_ID",
          "referrer": "https://www.example.com/*"
        }'

const { ComplyCube } = require("@complycube/api");

const complycube = new ComplyCube({ apiKey: "<YOUR_API_KEY>" });

const token = await complycube.token.generate("CLIENT_ID", {
    referrer: "https://www.example.com/*"
});

from complycube import ComplyCubeClient

cc_api = ComplyCubeClient(api_key='<YOUR_API_KEY>')

token = cc_api.tokens.create('CLIENT_ID','https://www.example.com/*')

 use ComplyCube\ComplyCubeClient;

$ccapi = new ComplyCubeClient('<YOUR_API_KEY>');

$report = $ccapi->tokens()->generate('CLIENT_ID', 'https://www.example.com/*');

using ComplyCube.Net;
using ComplyCube.Net.Resources.SDKTokens;

var sdkTokenApi = new SDKTokenApi(new ComplyCubeClient("<YOUR_API_KEY>"));

var sdkTokenRequest  =  { clientId = "CLIENT_ID" , 
                        referrer = "https://www.example.com/*" }

var sdkToken = await sdkTokenApi.GenerateToken(sdkTokenRequest);

2. Mount the SDK

To mount our Web SDK, you need to include it on your target page, as shown below.

<!DOCTYPE html>
<html>

  <head>
    <!-- Importing the Javascript library -->
    <script src="complycube.min.js"></script>
    
    <!-- Importing the default CSS -->
    <link rel="stylesheet" href="style.css" />
  </head>
  
  <script>
    var complycube = {};
    function startVerification() {
      complycube = ComplyCube.mount({
        token: "<YOUR_WEB_SDK_TOKEN>",
        onComplete: function(data) {
          console.log("Capture complete", data)
        },
      });
    }
  </script>
  
  <body>
    <!-- This is where the Web SDK will be mounted -->
    <div id="complycube-mount"></div>

    <!-- Clicking the button will start the ComplyCube verification UI -->
    <button onClick="startVerification()">Start verification</button>
  </body>
  
</html>

The links to complycube.min.js and style.css can be found in your developers portal.