One package wraps the official CREEM SDK, resolves live DataFast visitor IDs, injects them into checkout metadata, verifies webhooks, and forwards normalized payments back to DataFast. The public demo lets you see the whole loop instead of guessing.
The hard part is not firing one request. The hard part is carrying visitor context from the browser into CREEM, then making sure the webhook forwarding path lands in DataFast with the right amount, currency, transaction ID, and visitor attribution.
export const POST = createNextWebhookHandler(client);
await client.handleWebhook({ rawBody: req.body.toString('utf8'), headers: req.headers });const result = await client.handleWebhookRequest(request);
const result = await client.handleWebhookRequest(c.req.raw);
await client.handleWebhook({ rawBody: request.body as string, headers: request.headers });await client.handleWebhook({ rawBody: req.body.toString('utf8'), headers });The package resolves tracking from browser context or explicit input, then injects the final DataFast IDs before the checkout ever leaves your app.
If you use direct CREEM payment links instead of server-created checkouts, the browser helper still appends the attribution metadata for you.
Webhook signatures, event dedupe, retry with backoff, currency-aware amount conversion, and optional transaction hydration are part of the default path.
The demo does not hide behind promises. It shows browser tracking, checkout metadata resolution, webhook processing, and the exact payment payload forwarded to DataFast.
The DataFast SDK creates a real visitor and session, then flushes the first pageview through the demo's same-origin proxy.
Checkout creation injects the resolved DataFast IDs into CREEM metadata, whether the flow starts from your API route or a hosted payment link.
When CREEM sends the webhook, the package verifies the signature, normalizes the payment payload, and forwards the revenue event to DataFast.
The server checkout button uses the package wrapper directly. The direct-link button uses the browser helper to append DataFast metadata onto a hosted CREEM payment link. Everything below is live state from this demo instance.
This demo initializes the official DataFast SDK in the browser, stores visitor cookies on the root domain, proxies analytics events through the same Next.js origin, injects the live tracking IDs into Creem checkout metadata, and shows the exact payload forwarded back to DataFast after the webhook lands.