What is a Hosted Payment Page? How it Works

When planning to accept payments, integrating and going live quickly can ensure a smooth and swift road to generating revenue. Hosted payment pages can offer merchants the balance of a secure checkout with a quick go-live.

What is a Hosted Payment Page?

Hosted payment pages, sometimes known as hosted payment gateways, are pages hosted by a third party that provide secure checkout experiences for businesses. These pages enable merchants to quickly integrate and accept payments into their web experience without the time and resources needed to build and manage their own payment experience.

Types of Hosted Payment Pages

These hosted payment pages serve as checkout pages and experiences hosted completely offsite. The pages can take several forms and can be integrated in a few different ways.

• iFrame pages offered through gateways are often embedded directly into a merchant’s website or application, but are controlled and hosted entirely through a gateway provider. iFrame pages offer significant benefits to merchants, including a quick time to go live, and they offer slightly more control than webpage payment pages.
• Webpages redirect customers to a secure external website hosted by the gateway to complete the transaction. While checkout can happen externally through a link, webpages offer the least amount of control for merchants of the hosted payment page types as the experience is completely external.
• Pop-ups are payment pages that pop-up into the merchant’s website to complete the checkout flow. While customers can stay on the merchant’s website to complete checkout, pop-up blockers can make this a less desirable option.

How Hosted Payment Flows Work

Generally speaking, the payment gateway offering the payment flow will take care of the transactions from end-to-end. With a hosted payment experience, the customers will shop and add items to a cart through the merchant’s website directly. Then, when the customer is ready to checkout, the website will redirect to the hosted page to begin the transaction.

This includes:

1. Accepting payment information from the customer
2. Authorizing the card data
3. Sending payment information to the payment processor and the card issuer
4. Confirming shipping address and information
5. Returning the card authorization or refusal
6. Providing confirmation of purchase, including order number
7. Sending a receipt to the customer

Benefits of Hosted Payment Pages

While merchants do give up control over the features and functionality they can offer to what is provided by the gateway hosting the pages, they can see significant benefits over self-hosted checkout flows.

• Secure by Design - A significant benefit of an offsite payment flow is that transaction details do not pass through the merchant’s hands, reducing the PCI compliance burden. These payment pages inherit the security of the gateway that hosts them, which typically means enhanced security and protection of the cardholder data.
• Easy Integration - Integrating a hosted payment page into your online checkout experience is often significantly more straightforward than a more native developer-heavy integration, which means it takes significantly less time and fewer resources to go live. 
• Payment Method Availability - Depending on the chosen gateway, merchants can have dozens of payment methods available to their customers to complete their transactions. This can open the doors to a new customer base, and it can ensure loyal customers have the methods they prefer available to them.
• Better Checkout Experience - While merchants do give up control over the design of the checkout flow, the uniformity of hosted checkout experiences means the flow is user-tested and working. 

Alternatives to Hosted Payment Pages

If a merchant finds that hosted payment pages don’t fit the bill, they could choose to self-host the checkout flow and implement a solution like Basis Theory Elements. Leveraging the React Elements SDK, form elements will render a secure iFrame for capturing the data and then store it in a secure vault.

Elements offers a fast, dynamic, and secure way to seamlessly collect information within applications without exposing any systems to the underlying sensitive data. Elements are completely customizable, giving merchants complete control over the user experience while also keeping their own systems outside of PCI compliance scope.

If you would like a PCI-compliant solution for collecting card data, storing it, and leveraging it as if it were in your own system, contact our payment experts today to learn more.