React SDK demo

Plug in your sandbox API keys and run a full payment flow against @quickpay/react. This page creates a checkout session for you and hands the client_secret to the React components.

Test or live keys

This is not a production server, so live keys are accepted as well as test keys. Use a matching pair (pk_test_ with sk_test_, or pk_live_ with sk_live_). Live keys take real payments. Your secret key is forwarded through a Next.js route straight to the MPLEX Pay API and is never logged, persisted, or reused.

1. Configure

Renders the payment form on this page with @quickpay/react.

Starts with pk_test_ or pk_live_. Used by the browser SDK.

Starts with sk_test_ or sk_live_. Forwarded once to create the session — not persisted.

Decimal major units.

ISO 4217.

Optional.

Optional. Rendered as the invoice header on the receipt.

Optional. Each row becomes an InvoiceItem on the receipt. Leave empty to send the session amount as a single line.

Advanced: custom API base

Defaults to https://checkout.mplex.net. Override for self-hosted sandboxes.