Andre Franca

Using Cloudflare for Dynamic URL Redirects

Published: January 31, 2023
604 words · 2 minutes to read
Tagged: #technology#web-hosting.

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

$ touch _redirects index.html 404.html
/  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.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>403 Forbidden</title>
</head>
<body>
    <h1>403 Forbidden</h1>
</body>
</html>

Create a new Cloudflare Pages 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.

Set up a custom domain

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.

  1. Dynamically in this case means to preserve the current permalink structure, instead of DNS forward setup, which doesn’t allow this level of customization. 

  2. Feel free to add to your _redirects file a different set of rules. All options are well documented here

Questions, comments or concerns?
I'd love to hear your thoughts! Please share them through email or Mastodon.

<~ Previous: Website version 4.0

~> Next: We Need more Teaching on Digital Security

Articles from blogs I follow around the world wide web

Are you making these design mistakes on your blog?

This is a list of design mistakes that I think too many blogs make. I’ve made some of them myself over years, so I’m speaking from experience here… What a click-bait title, right? Honestly, I couldn’t think of a better one, so please don’t judge …

via Kev Quirk March 11, 2023

A rant on web font licenses

I make websites for a living. If you make websites for a living, sooner or later, you'll have to deal with web fonts. Yes, you can technically avoid them by going down the system fonts route, but designers love their fancy typefaces. And I don't b…

via Manuel Moreale RSS Feed March 10, 2023

"The longer you leave it, the better it has to be" and other weird, wrong ideas from my perfectionist brain

Two weeks ago, I caught a nasty cold (thanks, daycare). It didn't knock me over, but all I could manage was my day job, looking after the kids and feeding everyone. There was no daily writing practice, running or yoga. When I was on the mend, I decide…

via Rach Smith's digital garden March 5, 2023

Generated by openring