Client-Side Set Up

This section contains the information you need to set up the client side. You use the
Unified Checkout
 JavaScript library to integrate with your e-commerce website. It has two primary components:
  • The button widget, which lists the payment methods available to the customer.
  • The payment acceptance page, which captures payment information from the cardholder. You can integrate the payment acceptance page with your webpage or add it as a sidebar.
The
Unified Checkout
 JavaScript library supports
Click to Pay
 and manual card entry payment methods.
Follow these steps to set up the client:
  1. Load the JavaScript library.
  2. Initialize the accept object the capture context JWT. For information JSON Web Tokens, see JSON Web Tokens.
  3. Initialize the unified payment object with optional parameters.
  4. Show the button list or payment acceptance page or both.
The response to these interactions is a transient token that you use to retrieve the payment information captured by the UI.

Adding the Payment Application and Payment Acceptance

After you initialize the
Unified Checkout
 object, you can add the payment application and payment acceptance pages to your webpage. You can attach the
Unified Checkout
 embedded tool and payment acceptance pages to any named element within your HTML. Typically, they are attached to explicit named
<div>
 components that are replaced with
Click to Pay Drop-In UI
iframes
.
IMPORTANT
If you do not specify a location for the payment acceptance page, it is placed in the sidebar.
Client-Side Set Up