General redirects not working

Support
,
#1

Hi,

I’m trying to set up a general redirection from anything /* to / but I can’t get it to work properly.

I first tried with a netlify.toml file in the root of my site repository:

[[redirects]]
  from = "/google"
  to = "https://www.google.com/"
  force = true

[[redirects]]
  from = "/home"
  to = "/"
  force = true

[[redirects]]
  from = "/*"
  to = "/"
  status = 301
  force = true

The first two rules for /google and /home are added for testing purposes only, and they work, but not the last /* one. Tried with and without status.

Then, I tried with a _redirect file in the root of my site repository:

/* / 301

As I’m 100% sure that I’ll always want to redirect, even when the URL matches a static file, I also tried:

/* / 301!

Finally I tried to enable/disable asset optimization and Pretty URLs. None of these attempts are working. Maybe I misunderstood the * sign in the documentation. Could someone help me?

#2

Hey @myouf,
Do the first two work with no status code (200, 301, etc.)? As for the last rule, do you get an error, 404, or are you redirected to an unexpected page? And could you please share your Netlify URL?

#3

Hey @jen,

Yep, the first two worked without status code. With /*, there was no specific error, the redirection just wasn’t happening.

Tried a new test deployment with the following _redirects file:

/home / 301!
/google https://www.google.com/ 301!
/* / 301!

You can find it here. The problem seems to be the same. The first two rules work, not the last one.

#4

It’s possible that our redirects engine is getting confused since your first rule is encompassed by your last rule. Want to try deleting your first rule or moving it to the top (we process redirects from top to bottom of the file) and seeing if that works for you?

#5

Hi @jen,

As mentioned in my first message, the rules concerning /google and /home were added for testing purposes only. I already tried to configure only the line I’m interested in but it doesn’t seem to work.

You can check out my site here.

The current _redirect file is set up like this:

/* / 301!
#6

Shouldn’t that be:

/* /:splat 301!

#7

Hey @gregraven,

Tried with splat:

/* /:splat 301!

Browser tells the page isn’t working because the website redirected me too many times. It is normal because if you type http://www.site.com/any, you are redirected to http://www.site.com/any, and then to http://www.site.com/any and so on… it’s an infinite loop.

#8

Yeah, I was worried about the infinite loop.

If you want to redirect to your homepage, I think you’re looking for something like this:

/* /index.html 301!
#9

Hey @jen,

Trying with /* /index.html 301!, redirection works but the display of the index.html page is not correct (it looks like the CSS is not interpreted). This may come from the code of the site itself. I created it through react-static and I’m not familiar with this library. If I try without the exclamation mark, it works better. This being said I lose the functionality to redirect the user even if he specifies a path to a static file…

Could you tell me how the server on your side acts when we specify an exclamation point? Looks like the page isn’t interpreted the same way.

If it’s really not possible to solve this problem, I’ll keep the /* /index.html 301 solution :wink:

#10

I’m not seeing a difference between https://test-redirects-0.netlify.app and https://test-redirects-0.netlify.app/index.html. Each “version” appears the same, and each loads all files without error. I wouldn’t have coded a preload of the CSS immediately before calling that same CSS file, but the page does load as expected.

#11

Hey @gregraven,

Yep, it’s normal. The last version I deployed was the one with /* /index.html 301.
I redeployed a new version a few minutes ago with /* /index.html 301! in _redirects file.
You can find it here. As you can see, with the exclamation point, something different seems to be happening.

#12

hey @myouf, this thread is getting a little long, can you summarize whether or not you are seeing what you need to be seeing? I am a little lost.

#13

Hey, @perry.

Indeed the thread is starting to have a lot of posts haha :slight_smile: To sum up, I have a single-page site and my initial need is to redirect the user to the root of my site, whatever the url entered (including when this url matches a static file). So I simply tried with a /* / 301! rule in a _redirects file placed in the root directory of my site but the redirection didn’t work.

As proposed by Jen a little later, specifying “index.html” in the rule seems to have solved the redirection problem, like this : /* /index.html 301!. However, the display of the site is broken, as you can see here (maybe CSS not interpreted?). If I remove the exclamation mark to get /* /index.html 301, the redirection works and the display is not broken, but I lose the functionality of being able to redirect the user when the typed url matches a static file, which I’d like to avoid. It must be a specific behavior related to the exclamation mark but I don’t know how to fix it.

#14

@myouf Your stylesheet is not loading. This has nothing to do with redirects. Fix that and your site should display properly.

#15

Yep, it’s weird because if I switch from /* /index.html 301! to /* /index.html 301, it works. As you can see here with the new deployment, the CSS is ok when I remove the exclamation mark in the redirection rule. This may come from the fact that I use the react-static library to build my site, I still know very little about it and there may be a particularity. If nobody can direct me, I’ll keep the version without exclamation marks. I will also try to get answers from more advanced users of the library :wink:

#16

The exclamation mark means that your rule is forced. Therefore, everything will redirect to /index.html when you have the /* /index.html 301! rule… even your style sheet! This is something known as shadowing.

The /* /index.html 301 rule, without the exclamation mark, will redirect anything to /index.html when the requested file/page doesn’t exist.

This little guide may help and covers some of the topics such as fallback rules, shadowing and order of execution.

1 Like
#17

Hi all, sorry for bumping this thread, I’m encountering the same issue with a react app using react-router.
I need a redirect to / for any non-existing route,
I’m doing:
/* /
in _redirects file and it’s not working, while :
/* /index.html works as intended but the problem is that it leaves the path index.html after the domain and that bothers my client routing.
A temporary patch for me is to add a client route on react-router for “/index.html”, it obviously works, but that’s not ideal, and I wanted to know if there is a way to redirect directly to the root “/” path, as netlify does on default URLs first load.

This is the page: cesare-p.netlify.app
Thanks.

#18

Hey @Kais3rP,

For react specifically, I think that this is still the preferred workflow. Let me know how you get on!