Custom 404 is not working

Support
1

Hello. I’m new to Netlify and am having troubles configuring the custom 404 redirect.

I have created a project and added my custom domain to it (Netlify dashboard tells me to check my DNS configuration because my original nameservers point to Cloudflare, however, my website is served by Netlify). It’s available here: https://www.bubblebreaker.ml/index.html

My problem is, I’ve created a netlify.toml file in the root of my website folder (in the same directory as index.html, sw.js, etc.). It has the following contents:

[[redirects]]
  from = "/*"
  to = "https://www.bubblebreaker.ml/index.html#Error404"
  status = 404

However, no matter what wrong URL I enter (even for example, https://www.bubblebreaker.ml/a), I get the default Netlify 404 page. My Deploys tab says that 1 redirect rule processed without errors. But, it doesn’t seem to work. Can someone please help me with this?

2

@hrishikesh, would you please try making the “to” a path relative to the domain name like so?

[[redirects]]
  from = "/*"
  to = "/index.html#Error404"
  status = 404

A new deploy will be required for this to take effect. If this doesn’t work, please let us know.

1 Like
3

There’s a progress, not completely working, though.

Now, I’m not getting the Netlify 404 page, but, I’m getting my Home page (/index.html#Home). Is it possible that the part after ‘#’ is getting ignored?

4

The intended way to make a 404 redirect is mentioned in these docs:

I’d use that pattern instead.

5

I removed the redirect rule from my netlify.toml file and created another file as _redirects. I got the same result as:

6

@hrishikesh, I just visited https://www.bubblebreaker.ml/afsdfsfsdf#Home and it loaded your home page with a 404, which is what you’re trying to do based on your redirects:

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 404
[[headers]]
  for = "/*"
    [headers.values]
    Access-Control-Allow-Origin = "*"

Also note that fragments (the part after the #) aren’t processed server-side only the client browser does anything with them and they typically aren’t sent to a server.

1 Like
7

Yeah, I figured that out by now and thus, changed my 404 redirect to /index.html from /index.html#Error404 in the latest build. That’s why it’s loading the index.html page.

Thanks to all for help.

1 Like