GBG Developers

Guides   |   Configure SDK and Obtain GBG Access Token

Configure SDK and Obtain GBG Access Token

The SDK is modular and the SDK services are imported into the application code (for example into the index.tsx file) as show here if you’re using TypeScript:

import * as IDaaS from '../sdk/idaas.gbg';
import { Activities, Activity, ActivityActions, ActivityState, DeepPartial, DocumentAction, IActivityRequest, IAddressToVerify, ISDKState, JourneyActions, PeopleVerifyFieldNames, Provider, Tolerance } from '../sdk/idaas.gbg';

If you’re using JavaScript then no import command is used.

Next, create the SDK instance. The TypeScript example here defines the SDK as a private member within a class:

private sdkInstance: IDaaS.SDK = new IDaaS.SDK();

The SDK is configured using the configure function and parameters can be passed into it. An optional baseServiceUrl is shown here (it is not necessary to pass this).

The TypeScript example here then proceeds to obtain a GBG access token using the IDP access token which is passed in the idToken type parameter token. Note that the clientId, clientSecret and grantType fields are to be hard-coded as shown in this example.

this.sdkInstance.configure({
    baseServiceUrl: 'https://api.gbgplc.com/'
})
.then(() => this.sdkInstance.authenticate({
    clientId: 'ro.client',
    clientSecret: 'secret',
    grantType: 'id_auth',
    idToken: token
}))

A more complete example is shown below.

The ProviderConfiguration section is used to select if certain ways of uploading information are to be disabled. By default when using document and image related services, the user has the option of selecting a camera or manual file selection.

The templates sections are optionally used to influence the activities.

In this example, the JourneyOverview is being used to control the lower portion of the display which allows the user to abort or log out of verification process. The translationKey values are set to internal strings (see constants\configuration\translations.ts) however they can be overridden. For instance in the example the key JOURNEY__ABORT has the internal value Abort and that is displayed on the button when rendered. However it could be replaced with custom text.

The PeopleVerifyFormTextField in this example code is used to control how every text field in the People Verify activity behaves.

For more information on templates, refer to the docs/templates.md file in the SDK.

this.sdkInstance.configure({
    providerConfiguration: {
        [Provider.None]: true
    },
    templates: {
        [IDaaS.Templates.JourneyOverview]: {
            provider: `
                <div key="journey-overview">
                    <div key="journey-information" class="journey__overview__container">
                        {journey.personId ? <p><Translate translationKey="PERSON__ID" />: {journey.personId}</p> : null}
                    </div>
                    <div key="buttons" class="button__container">
                        <button key="abort" data-idaas-element="journey-overview--abort" onClick={onAbort}>
                            <Translate translationKey="JOURNEY__ABORT" />
                        </button>
                        <button key="log-out" data-idaas-element="journey-overview--log-out" onClick={onLogOut}>
                            <Translate translationKey="JOURNEY__LOG__OUT" />
                        </button>
                    </div>
                </div>
            `,
            type: IDaaS.TemplateType.String
        },
        [IDaaS.Templates.PeopleVerifyFormTextField]: {
            bindings: {
                isFieldRequired: this.isFieldRequired,
            },
            provider: `
                <fieldset key={"people-verify--form-field__" + name} data-idaas-element="people-verify--form-field">
                    <label key="field-label" htmlFor={name} data-idaas-element="people-verify--form-field--label">
                        <Translate translationKey={"PEOPLE_VERIFY__FIELDS__" + name} />
                    </label>
                    <input
                        key="field-input"
                        type={type}
                        id={name}
                        name={name}
                        onChange={onChanged}
                        data-idaas-element="people-verify--form-field--input"
                        value={value}
                    />
                </fieldset>
            `,
            type: IDaaS.TemplateType.String
        }
    },
})
    .then(() => this.sdkInstance.authenticate({
        clientId: 'ro.client',
        clientSecret: 'secret',
        grantType: 'id_auth',
        idToken: token
    }))
    .then(() => this.sdkInstance.initialise(document.getElementById('root') as HTMLElement)
)
    .then(console.debug);
}

 

Here’s a JavaScript example to initialize the SDK:

function initSDK() {
    return new window.GBG.IDaaS.SDK()
        // Set the configuration for it
        .configure({
        })
        .then((instance) => window.sdkInstance = instance)
        .then(() => window.sdkInstance.initialise(document.getElementById('root')))
}

To run the code, if you’re using the project files from Github with Visual Code, hold down Ctrl-Shift-B simultaneously, and then select Build (Development, Hosted, Watch) in order to generate the JavaScript and HTML files and serve them locally. With a web browser you can navigate to https://localhost:8080/ to see the code execute.

You can use the Developer Tools in Chrome to see the GBG Access Token request and response network activity, and the page will render the following:

Now you’re ready to begin coding verifications.

If you were using JavaScript, then to obtain a GBG Access Token the following code can be used:

function do_auth(accessToken) {
    return window.sdkInstance.authenticate({
        clientId: 'ro.client',
        clientSecret: 'secret',
        grantType: 'id_auth',
        idToken: accessToken
        })
        .then(() => console.log("obtained GBG access token"))
}

The initSDK and do_auth functions can be executed using:

initSDK()
.then(() => do_auth(access_token));

The variable access_token contains the IDP Access Token.