Environment variables
The Unchurn widget needs two environment variables on your server. There are no browser-facing or build-time variables for the signed-token SDK path.
| Variable | Required | Description |
|---|---|---|
UNCHURN_SECRET | yes | HMAC signing key. Get it from your Unchurn dashboard. Rotate it from the dashboard if you suspect a leak. |
UNCHURN_MERCHANT_ID | yes | Your merchant identifier from the Unchurn dashboard. |
Both are server-only. React components and the loader SDK call your own tokenEndpoint, so these values never need to reach the browser.
// app/api/unchurn/token/route.ts
import { createUnchurnHandler } from '@unchurn.dev/widget/server';
export const POST = createUnchurnHandler({
secret: process.env.UNCHURN_SECRET!,
merchantId: process.env.UNCHURN_MERCHANT_ID!,
resolveUser: async (req) => { /* ... */ },
});Browser Policy
The npm SDK and CDN install both load the hosted runtime from https://cdn.unchurn.dev/widget.js. If your app uses Content Security Policy, allow the runtime and widget stylesheet:
Content-Security-Policy:
script-src 'self' https://cdn.unchurn.dev;
connect-src 'self' https://app.unchurn.dev;
style-src 'self' 'unsafe-inline';