You wrote a Stripe Checkout integration. It works locally. Now you want a page in your docs where a prospect can click a button and watch a real session get created. Without you hosting a server. Without leaking your secret key.
This is a ten-minute walkthrough. By the end you will have an iframe-embeddable URL that creates a real Checkout Session through your account using a restricted key, with the viewer’s test card.
1. Pick a template, or upload your own
apiqube ships a Stripe Checkout template you can clone. Or push your own static HTML/JS bundle as a ZIP. If you are starting fresh:
npx apiqube push ./my-stripe-demo --name "Stripe Checkout"
You get back a public URL, plus a project ID you will use in the next step.
2. Declare your runtime config
Tell apiqube which values your demo needs. Secret values stay server-side and get injected by the proxy at request time. Public values render as a form in the side panel.
[
{ "key": "STRIPE_KEY", "visibility": "secret", "required": true },
{ "key": "PRICE_ID", "visibility": "public", "required": true,
"defaultValue": "price_1RtestExampleId" }
]3. Use a Stripe restricted key, not a secret key
Generate a restricted API key (rk_ prefix) in your Stripe dashboard with the minimum scope — for Checkout, you need `checkout_sessions:write` and `prices:read`. Paste it into the secret slot. If your key leaks, you can rotate it without rotating your whole account.
4. Embed in your docs
Add the iframe wherever the corresponding code block lives today:
<iframe src="https://www.apiqube.com/p/your-project-slug?embed=1" width="100%" height="540" sandbox="allow-scripts allow-forms allow-same-origin" ></iframe>
5. Watch the webhook stream
Every project gets a public webhook URL. Point your Stripe dashboard webhook endpoint at it. Now every Checkout completion in your demo shows up in your apiqube event log within seconds — useful when running a demo on a sales call.
Total time: less than ten minutes if you already had the demo locally. Less than thirty if you started from the template.