Tokenizer

Creating the iFrame:

Setting up the iFrame consists of three steps:

1. Generating an Authentication Key

2. Creating an iFrame configuration object

3. Loading the iFrame into the DOM using the Basys iFrame JS library. To test out the iFrame, the following script must be included into your page from this URL:

Test: 
<script src="https://api.basyspro.com/iframe/iframe/iframe-v3.js"/>

Generating the Authentication Key

The first step in utilizing the iFrame is establishing an authentication key. This is done by utilizing our token configuration API call.

/gateway/{gatewayId}/tokenization/configuration

When seeing this API call specify the an origin request header. Ex:

origin:https://app.iqpro.com

For security purpose, the endpoint is required to generate adhoc public token for the iFrame. Also note that the token is only valid for the 15mins duration. This time can not be change due to security reasons.

Example Response:

{
  "statusCode": "OK",
  "data": {
    "cardTokenizer": "IQPROV2",
    "achTokenizer": "IQPROV2",
    "iframeConfiguration": {
      "iqProV2": {
        "origin": "https://app.iqpro.com",
        "timestamp": "21001231235959",
        "tokenizationId": "<tokenization_id>",
        "tokenScheme": "PCI",
        "authenticationKey": "<Auth_Key>"",
        "pci": true,
        "expires": "2100-12-31T20:07:51.5519083Z"
      }
    },
    "proxyConfiguration": {},
    "achConfiguration": {
      "iqProV2": {
        "achUrl": "https://api.basyspro.com/vault/api/v1/Proxy/Ach"
      }
    },
    "mobileConfiguration": {
      "iqProV2": {
        "timestamp": "21001231235959",
        "tokenizationId": "<tokenization_id>",
        "tokenScheme": "PCI",
        "authenticationKey": "<Auth_Key>",
        "pci": true,
        "expires": "2100-12-31T20:07:51.5519083Z"
      }
    }
  }
}

Make sure you use data specified in the iframeConfiguration object above when building the configuration object.

Building the Configuration Object

The next step is creating the iFrame configuration object itself, which consists of the following parameters:

Putting It All Together

Now that you've built your configuration object, the last step is to render the iFrame on your form. Reference the Test Basys iFrame JS Library located at https://api.basyspro.com/Iframe/iframe-v3.js and invoke the TokenEx.Iframe() method to generate a new iframe object. This method accepts two parameters: the ID of the container in which you want to render the iframe and the iFrame Configuration Object you created.

var iframe = new TokenEx.Iframe("tokenExIframeDiv", iframeConfig); 
// Add event listeners here 
iframe.load();