A couple of days ago, a domain switch took place on this website, and I wanted to have a way to dynamically1 forward URLs from the old domain to the new one, preserving the current permalink structure.
Searching the web, I came across the “Using Netlify for Dynamic URL Redirects” article, written by Brad Taunt. Problem is, I didn’t want to sign up for Netlify just for that.
My blog is already hosted on Cloudflare, so it made sense to me to use it for the redirects too. I checked their documentation to see if something similar could be achieved. And it is, in fact, really simple and free.
Steps to reproduce
Setup content locally
- Create a folder in your computer and add the following files:
$ touch _redirects index.html 404.html
- Add the following2 to your
_redirectsfile:
/ https://domain.tld 301
/* https://domain.tld/:splat 301
Replace domain.tld with your domain.
Breaking down the above lines:
~ First line: Redirects all connections from the old domain’s home page to the new domain one;
~ Second line: A splat (asterisk, *) will greedily match all characters and use them to dinamically redirect a user to the new location with :splat.
- Add the following to both index.html and 404.html file.
<!DOCTYPE html>
<html lang="en">
<head>
<title>403 Forbidden</title>
</head>
<body>
<h1>403 Forbidden</h1>
</body>
</html>
Create a new Cloudflare Pages project
-
Access your Cloudflare Dashboard (create an account if needed) and click Pages on the sidebar.
-
Now, create a new project.
You have three options to setup your project: connecting to a git repository (usually Github or Gitlab); uploading a folder; or using the Wrangler cli tool. We’re uploading our folder in this example.
- Give a name to your project, upload the folder you just created, then click deploy.
Set up a custom domain
-
Now, in your new project’s page, look for the custom domains tab, then add a new domain.
-
Type your domain.tld, then follow the instructions given to add the proper
CNAMErecord to the assigned project url. If your DNS is managed by Cloudflare, this will be a 1-click process.
NOTE: If you’re redirecting from a zone apex, i.e. example.com, instead of a subdomain, Cloudflare will require your old domain name nameservers to match Cloudflare’s.
Conclusion
That’s pretty much it!
Cloudflare will be in charge of generating an SSL certificate for you, and by now, you’ll have all of your pre-existing URLs forwarded dynamically to your new domain.
TIP: A similar approach can be used to have your big URLs shortened to another small domain.tld. Of course, without all telemetry those URL Shortener services provide.