How to Redirect Domains Using Cloudflare Workers⚓
Summary⚓
Redirecting requests from one domain to another is something I would normally accomplish by way of nginx, however, this is something I can't make use of with Cloudflare Pages (Jamstack). Most of my domains with a static site would use a Page Rule to accomplish this. This involves creating a Forwarding Rule to create a 301 redirect from one domain to another.
The problem comes in when you exceed 3 redirects. I only need one more so buying additional redirects in blocks of five at $5 per block isn't worth it.
To get around this, I made use of Cloudflare Workers.
Cloudflare Workers is a serverless environment used to augment an existing environment by running scripts as needed. Cloudflare gives a generous 100,000 runs per day (at the time of this writing) which is more than enough for my needs.
My example will be redirecting traffic from a non-www domain (https://levine.org) to a www domain (https://kb.levine.io).
Cloudflare Workers⚓
- Open the levine.org site in Cloudflare dashboard.
- Go to the Workers tab.
- Click Manage Workers -> Create a Worker
- Delete the existing demo script and add the following code:
const base = "https://kb.levine.io"
const statusCode = 301
async function handleRequest(request) {
const url = new URL(request.url)
const { pathname, search } = url
const destinationURL = base + pathname + search
return Response.redirect(destinationURL, statusCode)
}
addEventListener("fetch", async event => {
event.respondWith(handleRequest(event.request))
})
- To test it's working properly, click the Send button for the Workers domain. It should generate the following:
- Once completed, all previous steps should result in the following:
- Once confirmed, navigate back to the Workers tab within the levine.org site.
- Click Add Route
- Set the route to
levine.org/* - Select the worker created in the previous steps.
- Click Save