Deploy a Kinde app on Cloudflare Workers

Cloudflare Workers provide a serverless edge runtime for deploying Next.js applications. This guide covers the specific configuration required to get Kinde authentication working correctly in this environment.

Important

Cloudflare Workers have a different runtime environment than traditional Node.js servers. Some configurations that work on Vercel or standard Node.js deployments require adjustments for Cloudflare.

What you need

Link to this section

• A Kinde account (sign up for free)
• A Cloudflare account (sign up for free)
• A running Next.js application configured with Kinde
• Node.js version 20 or higher

Key differences for Cloudflare Workers

Link to this section

Before diving into setup, understand these critical differences when deploying Kinde auth to Cloudflare Workers:

Consideration	Standard deployment	Cloudflare Workers
Environment variables	.env.local or platform UI	Public vars in wrangler.toml [vars]; secrets via wrangler secret put
process.env access	Works by default	Requires nodejs_compat_populate_process_env flag
KindeProvider	Can be used in providers	Avoid for SSR - use server-side auth patterns

Step 1: Configure Cloudflare Workers in your existing project

Link to this section

1. Open your project in a terminal and install the OpenNext.js adapter for Cloudflare Workers with the following command:

   npm install @opennextjs/cloudflare@latest

2. Install Wrangler CLI as a dev dependency:

   npm i -D wrangler@latest

3. Create a new file called wrangler.toml in the root of your project and add the following content:

   touch wrangler.toml

   wrangler.toml

   "$schema" = "./node_modules/wrangler/config-schema.json"
   main = ".open-next/worker.js"
   name = "my-app"
   compatibility_date = "2026-02-06"
   compatibility_flags = [ "nodejs_compat", "nodejs_compat_populate_process_env"]
   
   [assets]
   directory = ".open-next/assets"
   binding = "ASSETS"

4. Update your package.json to include the following scripts:

   package.json

   "scripts": {
     ...your other scripts...
     "preview": "opennextjs-cloudflare build && opennextjs-cloudflare preview",
     "deploy": "opennextjs-cloudflare build && opennextjs-cloudflare deploy",
     "cf-typegen": "wrangler types --env-interface CloudflareEnv cloudflare-env.d.ts"
   }

5. Preview your project in the Cloudflare environment using the following command:

   npm run preview

6. Add the generated .open-next directory to your .gitignore file.

   echo "/.open-next/" >> .gitignore

Step 2: Deploy your project to Cloudflare Workers

Link to this section

1. Authorize Wrangler to access your Cloudflare account using the following command:

   wrangler login

   This will open your default web browser, prompting you to log in to your Cloudflare account and authorize Wrangler. Once logged in, you’ll see a confirmation page.

2. Deploy your project to Cloudflare Workers using the following command:

   npm run deploy

   This will deploy your project to Cloudflare Workers. You’ll get a link to see the changes.

   Uploaded my-app (.. sec)
   Deployed my-app triggers (.. sec)
   https://<your-app-name>.<your-account-name>.workers.dev

3. Verify your deployment by visiting the health endpoint at the URL you got from the previous command:

   https://<your-app-name>.<your-account-name>.workers.dev/api/auth/health

   You may see localhost:3000 as the redirect URLs in the response. This is expected because Cloudflare Workers doesn’t read variables from the .env.local file. We will update this in the next step.

Step 3: Add Kinde env variables and redeploy

Link to this section

If you are using a custom domain, configure the domain in Cloudflare first, then use your custom domain URL everywhere below — in KINDE_SITE_URL, KINDE_POST_LOGIN_REDIRECT_URL, KINDE_POST_LOGOUT_REDIRECT_URL in wrangler.toml, and in the Allowed callback URLs / Allowed logout redirect URLs in your Kinde dashboard.

1. In your Kinde dashboard, go to your application > Details and add the following URLs:

   • Allowed callback URLs: https://your-app-url.com/api/auth/kinde_callback
   • Allowed logout redirect URLs: https://your-app-url.com

   Select Save

2. Update your wrangler.toml to include the following variables. You can get these from your Kinde application’s Quick start page.

   wrangler.toml

   # ...your existing config...
   [vars]
   KINDE_CLIENT_ID = "your_client_id"
   KINDE_ISSUER_URL = "https://your_business.kinde.com"
   KINDE_SITE_URL = "https://your-app-url.com"
   KINDE_POST_LOGIN_REDIRECT_URL = "https://your-app-url.com/dashboard"
   KINDE_POST_LOGOUT_REDIRECT_URL = "https://your-app-url.com"

   Important

   When copying values from your .env.local file, make sure not to include the KINDE_CLIENT_SECRET value because the wrangler.toml file is only for storing public variables.

3. Set your client secret to Cloudflare using the following command:

   npx wrangler secret put KINDE_CLIENT_SECRET

4. Redeploy your project to Cloudflare Workers using the following command:

   npm run deploy

5. Verify your deployment by visiting your app in the browser. Sign in or sign up with Kinde and you should be redirected to the dashboard page.

Troubleshooting

Link to this section

Verify your configuration

Link to this section

After deploying, you can verify your Kinde configuration by visiting:

https://your-app-url.com/api/auth/health

This endpoint will show your SDK configuration (with secrets redacted) to help debug any issues. You should see your Kinde application’s details.

Blank white screen after deployment

Link to this section

Cause:

The server returns 200 OK but the HTML body is empty. This is usually caused by KindeProvider being used in a way that breaks SSR on Cloudflare Workers.

Fix:

Remove KindeProvider from your providers and rely on server-side authentication patterns instead. Use the server-side authentication methods provided by the Kinde Next.js SDK.

Login redirects to localhost

Link to this section

Cause:

Clicking login redirects to localhost:3000 instead of your Kinde domain. Environment variables are not being read correctly, so the SDK falls back to development defaults when it can’t find the configuration.

Fix:

1. Ensure nodejs_compat_populate_process_env is in your compatibility_flags in wrangler.toml
2. Add all Kinde environment variables to the [vars] section of wrangler.toml (except KINDE_CLIENT_SECRET, which should be set via wrangler secret put)
3. Update the callback and logout redirect URLs in your Kinde application to match the URL you’re accessing the app from
4. Redeploy your application

”State not found” error

Link to this section

Cause:

After authenticating with Kinde, you’re redirected back with a “state not found” error. The authentication state cookie isn’t being persisted correctly between the redirect.

Fix:

• Ensure your KINDE_SITE_URL exactly matches the URL you’re accessing the app from
• Check that cookies are being set correctly in your Cloudflare Workers configuration
• If using a custom domain, ensure it’s properly configured in both Cloudflare and Kinde

Environment variables undefined in production

Link to this section

Cause:

Auth works locally but fails in production with undefined configuration errors. Cloudflare Dashboard environment variables aren’t automatically available via process.env.

Fix:

Environment variables must be defined in wrangler.toml for the SDK to access them. The Cloudflare Dashboard variables are available as Worker bindings but not through process.env without the nodejs_compat_populate_process_env compatibility flag.

For more troubleshooting and information, see the Cloudflare Next.js documentation.