API
Embed your website/checkout-page with our payments widget using our web-component or iframe SDK.
Sample App
You can play around with the SDK in SensePass's Front-end Playground website
The SDK exposes a few methods to let you operate the iFrame in various ways.
Script
Security
The frontend uses client ID that does not have permissions to payment except for initalizing the SDK
The backend uses device ID / Merchant API Key / Branch API key for calling the commit API
Using the JS API
Step 1 - Configuration
Create a global variable in your front-end website called SensePassFrontEndSDK
.
Set the following configuration for the sandbox
or production
environment:
Create an HTML element with the id sensepass-front-end
.
Step 2 - Initiate the iFrame element
Initiate the iframe with the init
method:
You can also handle the SDK client from the global variable, e.g. SensePassFrontEndSDK.init()
There is an optional argument for the
spClient.init(iframeContainerEl)
to let you set the iframe's container-element directly. This is a replacement option for the element by id search for thesensepass-front-end
value.
Step 3 - Style the frame dimensions (optional)
You can skip this implementation when using version 1.1.0 (beta)
Use the method frameDimensions
to get the iframe's width & height value (in pixels).
Assuming you have an element <div id="sensepass-front-end"></div>
you may get its iFrame (as its first child element) and apply the following callback's dimensions:
Step 4 - Listen to callback events
Using the above example, you may hook on to the following callbacks aswell:
Step 5 - Pay button event
Use the pay
method to let the payment method trigger its payment request:
Pay button event - For manual capture transaction type - see our docs here
billingAddress object is optional
Step 6 - Commit payment from your backend (Backend verification)
Last updated
Was this helpful?