Cloudflare workers preview urls
Hi, I'm hooking up kinde with nextjs deployed on a cloudflare worker and I'm looking to see if I can get preview urls working. I've seen https://docs.kinde.com/developer-tools/sdks/backend/nextjs-sdk/#working-with-preview-urls for Vercel but I don't think cloudflare expose a preview url env var I could dynamically set. Wondered if there has been anyone that's got it working? Or if there was a best approach to follow?
6 Replies
Hi RedSkyRuler,
Thanks for reaching out! I’m looking into this for you and will get back to you as soon as I have more details.
Hi RedSkyRuler,
I tried this out and Cloudflare does give you a Preview URL pattern (e.g.
That should cover the different preview URLs Cloudflare generates. I haven’t tested this end-to-end myself yet, but thought it could be a good direction to try. Let me know if it doesn’t work and we can dig in further.
*-next-cloudflare-test.arobce.workers.dev). You might be able to use that directly in Kinde by registering a wildcard callback like:
That should cover the different preview URLs Cloudflare generates. I haven’t tested this end-to-end myself yet, but thought it could be a good direction to try. Let me know if it doesn’t work and we can dig in further.
Thanks for getting back to me, yeah that wildcard is all good for the callback url. The issue is the setting of the
KINDE_SITE_URL , KINDE_POST_LOGOUT_REDIRECT_URL and KINDE_POST_LOGIN_REDIRECT_URL env vars in the nextjs app. They'd need to be dynamic to handle the different auth flow origin, otherwise I get the State Not Found errorHi RedSkyRuler,
Some research I did that might help your approach:
- Cloudflare lets you set env variables for different environments in
https://developers.cloudflare.com/workers/configuration/environment-variables/ - You can also give aliases when uploading previews, that should give you a standard preview url to work with e.g.:
https://developers.cloudflare.com/workers/configuration/previews/ - And here’s a community discussion around handling different env vars for preview URLs:
https://community.cloudflare.com/t/how-do-you-set-different-environment-variables-for-preview-urls/802898 Not sure if you’ve already tried these, but they look like the pieces Cloudflare provides to handle dynamic preview environments. Might be worth testing if they can help your setup. Other than that, I don’t believe anyone has implemented this yet with preview URLs, would love to hear how you got it working if you’re willing to share your approach.
wrangler.jsonc:https://developers.cloudflare.com/workers/configuration/environment-variables/ - You can also give aliases when uploading previews, that should give you a standard preview url to work with e.g.:
wrangler versions upload --preview-alias staginghttps://developers.cloudflare.com/workers/configuration/previews/ - And here’s a community discussion around handling different env vars for preview URLs:
https://community.cloudflare.com/t/how-do-you-set-different-environment-variables-for-preview-urls/802898 Not sure if you’ve already tried these, but they look like the pieces Cloudflare provides to handle dynamic preview environments. Might be worth testing if they can help your setup. Other than that, I don’t believe anyone has implemented this yet with preview URLs, would love to hear how you got it working if you’re willing to share your approach.
Thanks for the research! I haven't had time to investigate it just yet but i'll give it a go and can report back on here if I have any luck 🙂
Hi RedSkyRuler,
Sounds great, thanks for letting me know! And it would be super helpful if you can share what you find once you’ve had a chance to try it out. I’m sure others running on Cloudflare would benefit from your experience too.
Good luck with the testing! 🙂