Skip to content
Platform

Payment Gateway Integration: Hosted Checkout, Redirect or API?

There are four common ways to put a payment gateway into a website or app, from a redirect you can set up in an afternoon to a full API integration your developers own. How each one works, what it means for your security and PCI DSS scope, the steps every integration shares, and how to test before going live.

LILPE Editorial Team7 October 2026 11 min read
Cover for a guide comparing payment gateway integration methods: redirect, hosted, embedded and API

Choosing a payment provider is half the decision. The other half is how you connect it: whether customers leave your site to pay, pay in a window your provider controls, type into fields embedded in your page, or hand their details to your own servers. That choice decides how long the build takes, how the checkout looks, and, most importantly, how much of the security burden for card data lands on you.

Providers use different names for the same things ("standard", "seamless", "custom", "S2S"), so this guide describes each method by what actually happens to the customer and their data. It's written for founders and product owners deciding, and for developers planning the work.

The four common integration methods

Almost every provider offers some version of these. They differ in one thing above all: where the customer's payment details are typed and which systems they pass through.

  • Redirect (hosted payment page): the customer is sent from your site to a payment page on the provider's domain, pays there, and is sent back.
  • Hosted checkout in a pop-up or overlay: the provider's checkout opens over your page, usually loaded by a script you add. The customer feels they never left, but the payment form belongs to the provider.
  • Embedded fields: individual payment fields (card number, expiry, CVV) are hosted by the provider and shown inside your own form, typically as small frames. You control the layout; the provider's code handles the sensitive data.
  • Direct API (server-to-server): your own page collects all the details and your server sends them to the provider's API. You control everything, including the card data, which brings the most responsibility.

Two no-code options sit alongside these: payment links, which you send by message or email, and plugins for e-commerce platforms such as Shopify or WooCommerce, which configure one of the methods above for you.

Side by side

The trade-offs, in one table:

Payment gateway integration methods compared
Compared onRedirectHosted pop-upEmbedded fieldsDirect API
Where details are typedProvider's pageProvider's window over your pageProvider's fields inside your pageYour page
Card data touches your servers?NoNoNoYes
Control over look and flowLowMediumHighFull
Build effortLowestLowMediumHighest
Your PCI DSS burdenSmallestSmallModerateLargest
Customer leaves your site?Yes, brieflyNoNoNo
Good forGetting live fast, small teamsMost online stores and appsBrands that want a custom checkoutLarge businesses with their own security programme

Redirect: simplest, and still the default for many

A redirect is the least work and the least risk. Your server creates an order with the provider, the customer is sent to the provider's page with that order, and after paying they're returned to a URL you choose. Card numbers, UPI handoffs and bank logins all happen on the provider's side.

The cost is control and a moment of doubt for customers, who see a different page and domain. The return to your site is also the least reliable part: customers close tabs, lose signal or come back before the result is final, which is why the redirect can't be your proof of payment (more on that below).

Hosted pop-up: the common middle ground

A provider's checkout script opens a payment window over your page. You pass it an order created on your server; it shows the methods you've enabled, handles authentication and returns a result to your page. It keeps card data off your systems while the customer stays on your site, which is why many online stores use it.

Embedded fields: your design, the provider's data handling

If you want the payment form to look and behave like the rest of your checkout, embedded fields let you place the provider's secure fields inside your own form. Your page never reads what's typed into them; the provider's code turns the details into a token or a payment reference that your server then uses. You get control over layout, but your page now hosts the payment form, so its security matters more.

Direct API: maximum control, maximum responsibility

In a direct integration your systems collect the payment details and send them to the provider. For UPI and net banking, that mostly means handling redirects and handoffs to apps and banks. For cards, it means card numbers pass through your servers, and that changes your obligations significantly.

PCI DSS, the card industry's data security standard, applies to any entity that stores, processes or transmits cardholder data, or could affect the security of the environment where that happens. A direct card integration puts your servers squarely inside that scope. Separately, RBI's rules on card-on-file data don't allow merchants to store customers' full card numbers at all: saved cards work through tokens issued under RBI's tokenisation framework. Most businesses that think they need a direct card integration actually need embedded fields plus tokenised saved cards.

What every integration has in common

Whatever the method, a sound integration follows the same lifecycle. The method changes who draws the payment screen; it doesn't change these steps.

The lifecycle every payment gateway integration shares
  1. Create the orderOn your server, with the amount and your own reference
  2. Start the paymentRedirect, pop-up, embedded fields or API call
  3. Customer paysUPI app, card authentication, bank login
  4. Provider notifies youA signed webhook to your server
  5. You verify and fulfilCheck the signature and status, then mark the order paid
  6. Settle and reconcileMatch payments to settlements and bank credits

Two of these steps cause most production problems. The first is creating orders on the server: the amount must come from your system, not from the browser, or a customer could change it. The second is confirmation. The browser's return to your site proves nothing; the provider's server-to-server notification and its status API are the reliable signals. Our guide to payment gateway webhooks covers receiving, verifying and never missing them.

How each payment method fits in

The integration method is the frame; each payment method behaves a little differently inside it.

What changes by payment method in an integration
MethodWhat the customer doesWhat your integration must handle
UPI on mobileYour app or site opens their UPI app (intent), they approve with their PIN and returnThe return trip between apps, and payments that stay pending for a while
UPI on desktopThey scan a QR code shown at checkout with their phoneShowing the code, waiting for the result, and expiry if they don't pay
CardsEnter card details or pick a saved card, then authenticate with the bankAuthentication redirects or pop-ups, tokenised saved cards, declines
Net bankingLog in to their bank's site and approveA redirect to the bank and back, and slow or abandoned bank pages
Wallets and pay laterApprove in the wallet or lender's flowAnother handoff, and the provider's own statuses

Card authentication deserves its own read: most online card payments in India need a second factor such as an OTP, handled through the 3D Secure step. Our 3D Secure guide explains what happens there and why it fails.

Mobile apps: SDKs and app-to-app handoffs

In a native Android or iOS app, the same four methods exist, but they're usually delivered through the provider's mobile SDK rather than a web page. The SDK opens the provider's checkout screen inside your app, or provides native components for the payment fields, and returns a result to your code.

  • UPI in apps works by intent: your app asks the phone to open a UPI app, the customer approves the payment there, and control returns to your app. Your app must handle the customer coming back without finishing, and not treat that as a failure until the provider's status says so.
  • Card authentication can happen inside the app or in the bank's own app. Test both, on low-end phones and slow networks, because this is where app checkouts lose most customers.
  • The result your app receives is still a display hint. As on the web, your server should mark the order paid only on the provider's webhook or a status check, never on a message from the app, which a modified app could fake.

The integration steps, in order

A typical project, whichever method you choose:

  1. Get sandbox (test) credentials and read the provider's integration guide for your chosen method.
  2. Build order creation on your server: amount, currency, your order reference and customer details.
  3. Add the checkout: redirect URL, pop-up script, embedded fields or API calls.
  4. Build your webhook endpoint: verify signatures, handle duplicates, and update orders idempotently.
  5. Add a status check through the provider's API, for orders still pending after a set time and for support teams.
  6. Add refunds, partial and full, linked to the original payment.
  7. Test every outcome in the sandbox (see the table below), not only success.
  8. Go live: switch to live keys stored server-side, register the live webhook URL, and monitor the first days closely.

Test the unhappy paths

Integrations rarely fail on the successful payment. They fail on the customer who closes the tab, the webhook that arrives twice, the payment that stays pending for ten minutes. Test these before your customers find them:

A minimum test plan for a payment gateway integration
ScenarioWhat should happen
Successful paymentOrder marked paid once, from the webhook or a status check
Declined paymentOrder stays unpaid; customer sees a clear message and can try another method
Customer closes the tab after payingOrder still marked paid when the webhook arrives
Payment pending for several minutesOrder stays pending; no request to pay again; resolves when the final status arrives
Same webhook delivered twiceNo double fulfilment, no double email
Webhook with an invalid signatureRejected and logged
Amount changed in the browserIgnored: the server's order amount is what's charged
Full and partial refundsLinked to the original payment; status updated when confirmed

Security responsibilities by method

Whichever method you pick, some security work is always yours, and some grows with the method:

  • Always yours: keeping API keys and webhook secrets on the server, never in browser or app code; serving every page over HTTPS; verifying webhook signatures; limiting who can issue refunds.
  • Grows with embedded fields: protecting the page that hosts the payment form against tampering, because a compromised script on that page can affect what customers see.
  • Largest with a direct card API: everything PCI DSS requires of an environment that handles card data, plus proving it to your provider.

RBI's 2025 directions require payment aggregators to see that the merchants they onboard meet applicable security standards such as PCI DSS, so expect your provider to ask how your integration handles card data. Our guide to payment gateway security covers what protects a payment end to end and which parts are your job.

How to choose

A simple way to decide:

  • Small team, need to be live this week: a redirect or the provider's hosted pop-up. For an online store, a platform plugin.
  • Growing online store or app that cares about conversion: hosted pop-up, or embedded fields if design control matters.
  • Subscriptions and saved payment methods: a method that supports tokenised cards and UPI AutoPay mandates through your provider.
  • Several providers, or routing between them: an API-based integration, or an orchestration layer that gives you one integration across providers.

If you run an online store, our guide to payment gateways for e-commerce follows a single order from checkout to settlement. For developer documentation, sandbox access and integration practices, see our developers page.

Start simple, then move up

You don't have to pick a method for life. A common path for a growing business looks like this:

A typical progression of payment integration as a business grows
  1. LaunchPayment links or a platform plugin, to take money from the first customers within days.
  2. Early growthA hosted pop-up checkout with proper webhooks, status checks and refunds built in.
  3. ScaleEmbedded fields for a branded checkout, tokenised saved cards and UPI AutoPay for repeat customers.
  4. Multiple providersAn API-based or orchestrated integration that routes payments across providers and normalises their events.

What carries over at every stage is the server side: order creation, webhook handling, status checks, refunds and reconciliation. Build those properly once and changing the front end later is a much smaller job.

When you connect more than one provider

Adding a second provider for resilience or better approval rates doubles the integration work unless you plan for it: two order formats, two webhook formats, two sets of statuses and two settlement reports. Businesses in that position often put an orchestration layer between their checkout and the providers, so they integrate once and route each payment to a provider by rules. The providers still authorise, collect and settle under their own agreements; the layer decides where each payment goes. Our explainer on smart payment routing shows how those routing decisions are made.

Frequently asked questions

What is the difference between hosted checkout and API integration?

With a hosted checkout, customers enter payment details on a page or window run by the payment provider, so card data never touches your systems. With a direct API integration, your own page and servers collect the details and send them to the provider, which gives you full control but makes you responsible for securing card data under PCI DSS.

Which payment gateway integration method is the most secure?

For most businesses, a redirect or hosted checkout, because the provider handles the sensitive data and your exposure is smallest. Embedded fields keep card data off your servers too. A direct card API can be secure, but only with the full controls PCI DSS requires.

Can I store customers' card numbers for faster checkout?

No. RBI's rules don't allow merchants to store customers' actual card data. Saved cards work through tokens created under RBI's card tokenisation framework, which your payment provider supports.

Do I need webhooks if I already get a redirect back?

Yes. The redirect depends on the customer's browser and can be lost or arrive before the final result. The provider's webhook, verified by its signature, and its status API are what you should rely on to mark an order paid.

Which integration method do I need for subscriptions?

One that supports recurring payments through your provider: card mandates with tokenised cards, and UPI AutoPay mandates. Hosted and embedded checkouts usually support setting these up; the recurring debits themselves then run between your server and the provider's API, with pre-debit notices and webhooks for each charge.

How long does a payment gateway integration take?

A redirect or platform plugin can be live in days. A hosted pop-up with proper webhooks and refunds usually takes longer, and a custom embedded or API integration longer still, mostly because of testing the failure cases. Your provider's onboarding checks run in parallel.

Official sources

Last reviewed . Examples, amounts and screens marked illustrative are not LILPE figures.

Route every payment to where it succeeds.

Tell us which providers you use today and where payments get stuck. We'll show you what the setup would look like on LILPE.