One-Click Payments
One-click payment eliminates the need for customers to re-enter credit card details for repeat purchases, providing a seamless and efficient checkout experience. After the first payment, the system generates a unique token linked to the customer's card, enabling merchants to securely process future transactions without storing sensitive card details.
Key Benefits
- Enhanced Customer Experience: Simplifies repeat purchases by securely saving customers’ card details using tokenization.
- Increased Conversion Rates: Reduces friction at checkout, minimizing cart abandonment.
- Secure Payment Processing: Uses encryption and tokenization to protect sensitive card data.
Setting Up One-Click Payments
To implement one-click payments, you can use the Embedded Custom Checkout or the JavaScript SDK. These tools allow you to design and host a customized payment form on your website.
The one-click payment is composed of two flows:
- First-time Payment Process (Token Creation)
- Subsequent One-click Payment Process (Tokenized Payment)
First-time Payment Process (Token Creation)
This process occurs when the customer pays with Fondy for the first time. The payment card details are tokenized during this step, allowing them to be used in future payments. The following diagrams describe the process.
The following steps summarize the process to perform the first payment and generate a token:
-
The Merchant sends the order details to Fondy to create a new order.
-
Fondy receives the order data, stores it, and generates a hash (unique identifier for the transaction). The hash is returned to the Merchant, who saves it for future reference.
-
The Merchant starts the first-time checkout process by loading the payment form on the Customer Browser.
-
The customer enters their payment details on the checkout page, including the card number, CVV2, and expiry date.
-
The Fondy JavaScript SDK is loaded on the Customer Browser to handle and submit payment data securely.
-
The Customer Browser sends a payment request with the card details to Fondy using the JavaScript SDK.
-
Fondy encrypts and stores the card details and then processes the payment. It generates a token (representing the card) and a masked PAN (partial card number) for secure storage if approved.
-
If the payment was successful, a Fondy JavaScript SDK
onSuccess
callback with payment details, and the token is triggered on the customer browser. In addition, the Merchant also receives a server-to-server callback from Fondy with approved payment details and the token. -
The Customer Browser displays a thank you page confirming the successful completion of the payment.
Subsequent One-Click Payment Process (Tokenized Payment)
For future purchases, the stored token allows the customer to complete a transaction with Fondy with minimal input, typically only requiring their CVV2. The following diagram describes the process:
The following steps summarize the process to perform payments using a token:
-
The Merchant initiates a one-click payment using the previously saved token.
-
The Customer Browser displays the masked card number and prompts the customer to enter only their CVV2 for verification.
-
The Fondy JavaScript library is loaded on the Customer Browser to handle the payment submission.
-
The Customer Browser submits a payment request using the saved token and CVV2 through the Fondy JavaScript SDK.
-
Fondy receives the tokenized payment request and processes the payment.
-
If the payment is approved, the Fondy JavaScript SDK triggers the
onSuccess
callback on the Customer Browser, confirming the successful payment. In addition, a successful server callback is also sent to the Merchant from Fondy with the approved payment details. -
The Customer Browser displays a thank you page to confirm the payment completion.
Updated 8 days ago