Custom Subdomain for Cloudflare Pages Preview Deployments
Cloudflare Pages support custom domains to serve Static and Dynamic content. When deployed using git, it also supports to build and deploy so-called Preview deployments based on other branches in the same git repository.
Having preview deployments is a great way to check upcoming changes to a frontend application before having it in production to not disturb users using it currently and test out changes for development teams or a small amount of users. These preview deployments get their own unique subdomain to check them out online. Unfortunately, preview deployments don’t support custom domains at the moment. This means you can’t have something like beta.example.com for your preview deployment.
However, I wanted a custom subdomain for the latest preview deployment. To make this happen, I’m using a Cloudflare Worker to get the preview deployment URL on a regular basis using Cloudflare Workers cron-triggers and put the URL in Cloudflare KV. The Worker is running on the beta.example.com subdomain and fetches the preview deployment URL from the KV upon request and serves this page. The flow looks like this:
When a visitor then requests the Worker Route (beta.example.com), it’ll fetch the URL information from KV since that’s way, way faster than calling the API for every single request and can be cached as well and will act as a proxy and fetch the actual contents from the Cloudflare Pages Deployment.
This is where things go crazy but work just fine, the flow looks like this now:
You call a Worker, the Worker fetches the Pages Deployment and sends everything over to the user. But hey, it works just fine as a workaround!
How to set this up and have a copy and paste-able Worker is part of this GitHub Repository