Click to Pay Drop-In UI Flow
Click to Pay Drop-In UI
FlowTo integrate
Unified Checkout
into your
platform, you must follow several integration steps. This section gives a high-level
overview of how to integrate and launch Unified Checkout
on your webpage and process
a transaction using the data that Unified Checkout
collects for you.
You can find the detailed specifications of the APIs later in this document.- You send a server‑to‑server API request for a capture context. This request is fully authenticated and returns a JSON Web Token (JWT) that is necessary to invoke the frontend JavaScript library. For information on setting up the server side, see Server-Side Set Up.
- You invoke theUnified CheckoutJavaScript library using the JWT response from the capture context request. For information on setting up the client side, see Client-Side Set Up.
- You use the response from theClick to Pay Drop-In UIto retrieve payment credentials for payment processing or other steps.
The figure below illustrates the system's payment flow.
For more information on the specific APIs referenced, see these topics:
Enabling Unified Checkout in the Business Center
Unified Checkout
in the Business Center
To begin using the
Click to Pay Drop-In UI
powered by Unified Checkout
, you must first ensure that your merchant ID (MID) is
configured to use the service and that Click to Pay
is properly
set up.- Log in to theBusiness Center:Production URL:
- In theBusiness Center, go to the left navigation panel and choosePayment Configuration>Unified Checkout.
- ClickSetupand follow the instructions to enroll your business inClick to Pay. WhenClick to Payis enabled, it appears on the payment configuration page.
- ClickManageto alter yourClick to Payenrollment details. For more information on registering forClick to Pay, see Enable Click to Pay.