/    Sign up×
Bounties /Pin to ProfileBookmark

Force CloudFlare to add trailing slash with Page Rules

I’m working on a site that currently has both trailing slash and non-slashed URLs active. For example, visiting /page-name and /page-name/ both work and causing SEO canonical issues.

Using only CloudFlare, I’d like to write a Page Rule to solve this. I tried:

// URL to forward
*example.com/*

// Final 301 redirect destination
https://example.com/$2/

CloudFlare then gives this error and will not create the Page Rule:
“Forwarding URL matches the target and would cause a redirect loop.”

How can I resolve this?

to post a answer
Network Management

7 Replies

Copy linkTweet thisAlerts:
@0xJan 23.2023 — try:

var links = document.getElementsByTagName('a');
for (vari = 0; i < links.length; i++ {
var link = links[i];
if (link.href.indexOf('http') == 0) {
if (link.href.indexOf('/', link.href.indexOf('//') +
2) == -1) {
link.href += '/';
}
}
}
Copy linkTweet thisAlerts:
@attilalbJan 24.2023 — You could try creating two separate page rules:

One rule should redirect all requests that have a trailing slash to the non-slashed version of the URL (e.g. redirect /page-name/ to /page-name.

The second rule should redirect all requests that do not have a trailing slash to the version of the URL with a trailing slash (e.g. redirect /page-name to /page-name/).

This way, you redirect all the traffic to the same url with or without trailing slash.

Rule 1:

// URL to forward
*example.com/*/
// Final 301 redirect destination
https://example.com/$1


Rule 2:

// URL to forward
*example.com/*
// Final 301 redirect destination:
https://example.com/$1/
@buildinteractiveauthorThanks but the 2nd rule creates the same problem mentioned: "Forwarding URL matches the target and would cause a redirect loop."Feb 01.2023
Copy linkTweet thisAlerts:
@jordan-thirkleJan 26.2023 — Why you're seeing the error
The error message you're seeing is because the URL you're trying to forward to is the same as the URL you're trying to match.

This would create a redirect loop.

How do you solve this?
A possible way to solve this is to:
Use a different pattern to match the non-trailing slash URLs and redirect them to the trailing slash version.

To do this you would:
Use a regular expression pattern to match URLs that do not have a trailing slash and redirect them to the same URL with a trailing slash.

An example of a Page Rule that could work:

URL to match: *example.com/page-name[^/]

Action: "Forwarding URL"

Status code: "301 - Permanent Redirect"

Destination URL: https://example.com/page-name/$1/


Steps to input this into CloudFlare:
Log in to your Cloudflare account and select the website for which you want to create the Page Rule.
Go to the "Page Rules" section and click on the "Create Page Rule" button.
In the "If the URL matches" field, enter the pattern you want to match, which is *example.com/page-name[^/] in the example I provided earlier.
Under "Then the settings are," select "Forwarding URL" from the dropdown menu.
In the "Status code" field, select "301 - Permanent Redirect"
In the "Destination URL" field, enter the URL you want to redirect to, which is https://example.com/page-name/$1/ in the example I provided earlier.
Click on the "Save and Deploy" button to create the Page Rule.

Note: it's good practice to use rel=canonical to specify the preferred version of the URL, search engines will use this to understand which version should be indexed.

You can repeat this process for any other pages that are having this issue and you can use a wildcard pattern to match all pages and redirect them to their respective trailing slash URLs.

Hope this helps!
@buildinteractiveauthorThis seems specific to individual pages where you have "page-name" mentioned. How can I make this site-wide with a single Page Rule? And thanks for your time!Feb 01.2023
Copy linkTweet thisAlerts:
@steimeFeb 13.2023 — To resolve the issue, you can use the following Page Rule in CloudFlare:

// URL to forward
example.com/(?!/)

// Final 301 redirect destination
https://example.com/$1/$2/

This Page Rule uses the negative lookahead assertion (?!/) to only match URLs that do not have a trailing slash. The $1 and $2 variables in the redirect destination match the captured parts of the URL that match the pattern in the first line.

This will redirect URLs like example.com/page-name to https://example.com/page-name/, but it will not redirect URLs with a trailing slash. This will ensure that there is no redirect loop, as the redirected URL will not match the pattern in the first line.

I hope this helps with your issue
Copy linkTweet thisAlerts:
@OnlineDevelopersFeb 13.2023 — To resolve this issue, you need to add an exception in your Page Rule to avoid the redirect loop. Here's an example:

URL to forward: example.com/*
Final 301 redirect destination: https://example.com/$1/
Exceptions: example.com/$1 (this will be your exception)
This way, when a user visits example.com/page-name, it will forward to https://example.com/page-name/ but exclude the exception example.com/$1, so there won't be a redirect loop.
Copy linkTweet thisAlerts:
@OnlineDevelopersFeb 13.2023 — Go to the CloudFlare Page Rules section.

Create a new Page Rule by clicking the "Create Page Rule" button.

In the "If the URL matches" field, enter the pattern of your non-trailing slashed URLs, for example: example.com/*.

In the "Then the settings are" section, select "Forwarding URL" and set the status code to "301 (Permanent Redirect)".

In the "Destination URL" field, enter the pattern for the redirected URL with a trailing slash, for example: https://example.com/$1/$2/.

Save the Page Rule.

Repeat the process for all the non-trailing slashed URLs on your site.

With this Page Rule in place, visiting a non-trailing slashed URL such as example.com/page-name will automatically redirect to example.com/page-name/ with a status code of 301.
Copy linkTweet thisAlerts:
@OusseemFeb 13.2023 — You can resolve the redirect loop issue by creating two separate page rules, one to redirect non-slashed URLs to the slashed version, and another to redirect any URL with two slashes to the single-slashed version.

For the first rule, you can use the following settings:

URL Matches: example.com/ (without trailing slash)
Forwarding URL: https://example.com/$1/ (301 - Permanent Redirect)

And for the second rule, you can use the following settings:

URL Matches: example.com// (URLs with double slashes)
Forwarding URL: https://example.com/$1/ (301 - Permanent Redirect)

By doing this, you ensure that all non-slashed URLs are redirected to the slashed version, and that any URL with two slashes is also redirected to the single-slashed version. This will eliminate any potential canonical issues, and ensure that all URLs for your site are consistent and properly redirected.
×

Success!

Help @buildinteractive spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 4.25,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...