How to Integrate the Web Client SDK for Device Data Collection into Your Website

When testing your integration with the kount-web-client-sdk, do not load test. Test new features against the TEST environment. When you are done testing, execute in the PROD environment.

The clientID is the unique static value obtained during the initial account setup that does not change across solutions or environments.

The isSinglePageApp has a boolean value of true or false, and is used to specify if the SDK is executing in the context of a Single Page Application (SPA).

The sessionID has a character string with a maximum length of 32 randomized characters that must be generated by you. Only alphanumeric characters, dashes, or underscores can be used. The sessionID must remain unique to the originating user's website visit and cannot be reused for a minimum of 30 days.

For more information on Session IDs, review How to Create a Session ID for the Device Data Collector.

Callbacks 

The Web Client SDK provides a callback system that allows you to execute custom code at certain points in the data collection process. You can use the kountConfig object to add one or more life cycle hooks with a function (or lambda) of your choice.

There are two callbacks: collect-begin and collect-end.

The collect-begin callback triggers when the collection starts, while the collect-end triggers after the collection ends.

When executed, the callback functions are given one parameter, which is a JavaScript object containing the sessionID: string and the KountClientID: string.

Example of adding optional callbacks (with arbitrary callback code) to the kountConfig object set up in base configuration:

kountConfig.callbacks = {
        'collect-begin': function (params) {
            // Any code you'd like to execute on collection start,
            //     such as quietly adding the session ID to your login form!
            var loginForm = document.forms['loginForm'];
            var input = document.createElement('input');
            input.type = 'hidden';
            input.name = 'kaId';
            input.value = params['SessionID'];
            loginForm.appendChild(input);
        },
        'collect-end': function (params) {
            // Any code you'd like to execute when we're done collecting data
            loginButton = document.getElementById('login_button');
            loginButton.removeAttribute('disabled');
        }
    };

If additional SDK logging is needed during SDK integration troubleshooting, an optional isDebugEnabled boolean node can be set to true within the configuration object passed into the kountSDK function.

When this value is set to true, more detailed SDK logging appears in the browser console. Set this value to false in production.

Example:

let kountConfig = {
    clientID: "YOUR_CLIENT_ID",
    environment: "TEST_OR_PROD_DEPENDING_ON_THE_ENVIRONMENT",
    isSinglePageApp: true,
    isDebugEnabled: true,
};