Show competitions
Embed SDK
A small script that mounts a competition card, a results panel, or the payment step of a checkout you started from your backend.
<script src="https://www.bitraffle.io/embed.js"></script>
<div id="raffle"></div>
<script>
BitRaffle.lot("#raffle", { host: "https://www.bitraffle.io", org: "your-org", lot: 71 });
</script>The script defines a global BitRaffle. An ES module build is at /embed.esm.js. Every call returns a handle with unmount().
BitRaffle.lot(target, options)
A competition card, or the grid of all live competitions when lot is left out.
| Option | Type | Description |
|---|---|---|
host | string | Your BitRaffle host, e.g. https://www.bitraffle.io. |
org | string | Your organisation slug: your-org. |
lot | number | Optional competition id. |
BitRaffle.results(target, options)
The outcome of one competition: the winner (address masked), how they were drawn and the proof. Cancelled and pending competitions say so. Takes host, org and lot (required).
BitRaffle.results("#outcome", { host: "https://www.bitraffle.io", org: "your-org", lot: 71 });BitRaffle.checkout(target, options)
Renders the payment step of a checkout session your backend started, and tells you when the buyer's tickets are issued. Your secret key stays on your server: your backend starts the session and proxies the status poll, and the browser only sees the session and the payment provider's own card form.
// session: the `data` object from POST /api/v1/checkout/sessions, passed from your backend
BitRaffle.checkout("#pay", {
session,
poll: () => fetch(`/my-api/raffle/${session.id}`).then((r) => r.json()),
onPaid: (status) => showTickets(status), // fires once tickets are ISSUED
onFailed: (reason) => showError(reason),
onRedirect: (url) => window.open(url), // optional: open redirect payments in a popup
// Worldpay only: proxy POST /api/v1/checkout/sessions/{id}/confirm
confirm: (hrefs) => fetch(`/my-api/raffle/${session.id}/confirm`, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(hrefs),
}).then((r) => r.json()),
payLabel: "Pay $4.00",
});| Option | Description |
|---|---|
session | Required. The session object from your backend. |
poll | Returns the session status (your proxy of GET /checkout/sessions/{id}). |
onPaid | Called when the tickets are issued, not merely when a form is submitted. |
onFailed | Called with the reason when the payment fails. |
onRedirect | Optional. Handle redirect payments yourself, for example in a popup. |
confirm | Worldpay only. Your proxy of POST /checkout/sessions/{id}/confirm. |
payLabel | Optional label for the pay button. |
pollIntervalMs | Optional poll interval. |
What renders
payment.type | Renders |
|---|---|
PAY_URL, CODE_URL | A redirect to the provider's page (or your onRedirect). |
CKO_FLOW | Checkout.com Flow, in place. |
STRIPE_EMBED | Stripe Embedded Checkout, in place. |
WP_SDK | Worldpay hosted card fields, in place. Needs confirm. |