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?
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?
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?
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.
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.
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
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.
Indeed the thread is starting to have a lot of posts haha 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.
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
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.
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.
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 