Setting Up the Client Side

You can integrate
Microform Integration
with your native payment acceptance web page or mobile application.

Web Page

Initiate and embed
Microform Integration
into your payment acceptance web page.
  1. Add the
    Microform Integration
    JavaScript library to your page by loading it directly from
    . See Version Numbering. You should do this dynamically per environment by using the asset path returned in the JWT from
    . For example:


    ctx": [ { "data": { "clientLibrary":, ...
    • Test
      <script src=""></script>
    • Production
      <script src=""></script>
  2. Create the HTML placeholder objects to attach to the microforms.


    Microform Integration
    attaches the microform fields to containers within your HTML. Within your HTML checkout, replace the payment card and CVN tag with a simple container.
    Microform Integration
    uses the container to render an iframe for secured credit card input. The following example contains simple
    tags to define where to place the PAN and CVN fields within the payment acceptance page:
    <div id="number-container" class="form-control"></div>
    . See Example: Checkout Payment Form.
  3. Invoke the Flex SDK by passing the capture context that was generated in the previous step to the microform object.


    var flex = new Flex(captureContext);
  4. Initiate the microform object with styling to match your web page.


    After you create a new Flex object, you can begin creating your Microform. You will pass your baseline styles and ensure that the button matches your merchant page.
    var microform = flex.microform({ styles: myStyles });
  5. Create and attach the microform fields to the HTML objects through the Microform Integration JavaScript library.


    var number = microform.createField('number', { placeholder: 'Enter card number' }); var securityCode = microform.createField('securityCode', { placeholder: '•••' }); number.load('#number-container'); securityCode.load('#securityCode-container');
  6. Create a function for the customer to submit their payment information, and invoke the tokenization request to
    Microform Integration
    for the transient token.

Mobile Application

To initiate and embed
Microform Integration
into native payment acceptance mobile application, follow the steps for web page setup, and ensure that these additional requirements are met:
  • The card acceptance fields of PAN and CVV must be hosted on a web page.
  • The native application must load the hosted card entry form web page in a web view.


As an alternative, you can use the Mobile SDKs hosted on GitHub:
Back to top