In this article I will walk through how to create page redirects in Cloudflare. The redirect I’m creating here is one to go from one page to another so for example to go from /blog
to /posts
. In many cases it may be more preferable to set these redirects up in Cloudflare as you can avoid extra requests going to the site which results in lower load and cheaper running costs. Cloudflare also serves these requests closer to wherever the visitor is coming from so it leads to a faster experience for them too.
Cloudflare have recently updated their redirects feature which may cause confusion as most of the posts I’ve found online relate to the old way of doing this through page rules.
Example
The example I’m using here is to redirect the homepage (/
) to the /posts
page.
- First navigate to the redirect rules page which is under the rules section in the Cloudflare dashboard
- The incoming requests should match whatever you choose so in my example it will be “URI Path” equals
/
. This is represented in the expression preview box as(http.request.uri.path eq "/")
- As this is a single path we can use a static URL redirect and set the URL to be
/posts
. I also want to keep the query string (e.g./?foo=bar
) so I will tick that box. Status code can be whatever you like, I’ve a section below with more detail. In the end it will look like the following screenshot:
Testing it works
Here’s an example curl output once the redirect has been deployed. We can see the redirect location from mutablecomment.com
is to /posts
. As it is a temporary redirect the response does not get cached
$ curl -IL mutablecomment.com
HTTP/1.1 307 Temporary Redirect
Cache-Control: private, max-age=0, no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Expires: Thu, 01 Jan 1970 00:00:01 GMT
Location: /posts
What status code to choose?
When I’m testing a new redirect I use 307 Temporary Redirect as it does not get cached and is easier to change when testing. Once you have made sure it works as expected you can easily change the returned status code to one of the ones supported by Cloudflare:
- 301 Moved Permanently: resource has permanently moved
- 302 Found: resource has been temporarily moved to the given
Location
- 303 See Other: redirects link to another page instead of the requested resource
- 307 Temporary Redirect: resource has been temporarily moved to the given
Location
. Cloudflare will not cache this - 308 Permanent Redirect: resource has been moved to the given
Location
. This gets cached automatically by Cloudflare