Skip to content

Embedded checkout

Checkout that lives inside your product.

Render a complete payment form within your own pages, so customers never feel like they've left. You keep control of the experience; the provider keeps card data secure.

Illustrative merchant website with embedded checkout

Illustrative preview with sample data.

Highlights

Drops into any page

Mount the checkout into a container element on your site, whether it's a single-page app or a server-rendered store.

Origin-restricted

Each session can only be embedded on the origins you list. Everywhere else, framing is blocked.

Card data stays out of scope

Card numbers are entered into the provider's secure fields and never reach your servers or ours.

Feels native

Clean, neutral styling that sits comfortably alongside your own typography and layout.

Server-side truth

Treat the browser as a hint and confirm results with signed webhooks or the API.

Same sessions as hosted

Embedded and hosted checkout share one session model, so you can switch without re-integrating.

Details

Engineers pairing at a computer
1

Built for your own domain

Create a session on your server with the origins that are allowed to display it, pass the session's client identifier to your page, and mount it.
  • Create the session server-side with your secret key
  • Allowed origins are enforced per session
  • Never expose secret keys in the browser
  • Works in sandbox with test keys and test data
2

Designed to be hard to misuse

Amounts, currency and merchant are fixed when the session is created on your server. Nothing the paying browser sends can change them.
  • Server-fixed amounts and currency
  • Session expiry and one-time completion
  • Payment outcome confirmed through the provider
  • Events signed with HMAC-SHA256

Build

Works from the dashboard or the API.

The client SDK mounts a session created on your server. Exact SDK names may change while embedded checkout is in preview; see the developer docs for the current reference.

embed.html (illustrative)
<div id="checkout"></div>

<script type="module">
  // clientSecret comes from a session your server created
  // with allowed_origins: ["https://yourstore.example"]
  const checkout = await Checkout.mount("#checkout", {
    clientSecret: window.__SESSION_SECRET__,
    onComplete: () => location.assign("/thanks"),
  });
</script>

The future of payments is connected.

Build on infrastructure that can evolve with new providers, markets, payment methods and intelligent commerce. Start free in sandbox today.

No sales call required. Create an account and access your developer sandbox.

  • Payment succeeded$248.00 · Hosted checkout
  • Invoice paidINV-0142 · $5,616.00
  • Webhook deliveredpayment.succeeded · 200 OK