Redirect with only case changing causing ERR_TOO_MANY_REDIRECTS

[thepuzzlemaster]

I have a page searchListings. My CEO sent out a link to a bunch of people with searchlistings as the url. I tried to create a redirect in next.config.js, but it doesn't work in all cases, or it causes an infinite redirect loop.

The following settings cause an infinite redirect loop no matter which version is navigated to.

{
  source: '/searchlistings',
  destination: '/searchListings'
}

The following works in most cases, but causes a 404 if navigating to /searchlistings/.

{
  source: '/searchlistings/',
  destination: '/searchListings'
}

Is there a way to set this up so it works in all cases?
In the second example, it seems confusing that /searchListings/ would work fine, but /searchlistings/ would return a 404.

[thepuzzlemaster]

Oh. Interesting. So apparently it works fine in all cases once deployed to production. But when testing locally, it would return a 404.

[wilsonneto-dev]

Wooow @thepuzzlemaster, we have a big problem here...

First of all, I will give you a piece of important advice, don't use camel case in your routes, don't use upper case, use only lower case in URLs... I say that because the behavior in most cases is unpredictable, for example, after you access the route "domain/Home" and it runs, if you access "domain/home" the chrome browser will replace the URL with "domain/Home" (the first one), windows servers such as IIS works ignoring case in URL, Linux servers will consider the case of URL... Then, just work with snake case in your URLs, this will avoid a lot of headaches and problems for you.

After this advice, lets to a possible solution:

As you can notice, redirects are case insensitive while your pages are case sensitive, then, the simples way is o configure a redirect like this:

{
  source: '/searchlistings',
  destination: '/search-listings'
}

And then rename your page to "search-listings.jsx" (.jsx, or .js, or .tsx, depends on your project)

I hope it helps you.
Give us feedback about this solution, if it works or not.
Success in your projects man!

[thepuzzlemaster]

Thanks very much for the advice and the clear explanation. Mistakes were made...
I think your suggestion should work here. I ended up using camelCase because that's how I name my files, where the routes come from. I'll work on correcting this mistake though.

I'll let you know if I run into anything else. Really appreciate the guidance.

[wilsonneto-dev]

You are welcome man! Great, I wish you success in your projects!