Another redirect question. #!

I have a Gatsby site which loads a front-end script. This script is some auction software which loads pages in via #! urls

For example!/itemDetails/419/37888
I see lots of traffic from URLs like…!/itemDetails/419/37888 (it’s missing the word auction from inside the URL)

I’ve set up a redirect in my TOML file…

from = “/#!/*”
to = “/auction/#!/:splat”
status = 301
force = true

but it’s being completely ignored (other redirects in that file work fine). I think it’s because the page and javascript are stopping any redirects.

How can I get around this with Netlify? I’ve tried TOML, _redirects and Gatsby’s createRedirect() with no luck at all.

Is the only way to use a Netlify Edge Function or is there a simpler way?
If Netlify edge functions are needed, then what is the best way to handle these splats in Netlify edge?

hi there, I strongly suggest you give it a thorough read through and see if this fixes your problem:

You definitely do not have to use edge functions to set up your redirect.


It is because a # symbol is interpreted by the browser, so the Netlify redirect engine is never aware of it. This is a fundamental part of how the WWW/HTML/etc. works.

See this answer on stack overflow

If you need/want to handle an # in a URL as explained in this post is to handle it with client-side javascript. Use the URL() constructor to create a URL object. You can then check for the existence of URL.hash along with pathname etc. and redirect accordingly.

  hash: "#!/itemDetails/419/37888"
  host: ""
  hostname: ""
  href: "!/itemDetails/419/37888"
  origin: ""
  password: ""
  pathname: "/auction/"
  port: ""
  protocol: "https:"
  search: ""
  searchParams: URLSearchParams(0)
  username: ""
1 Like