Another redirect question. #!

Support
,
1

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 https://www.apexauctions.co.uk/auction/#!/itemDetails/419/37888
I see lots of traffic from URLs like… https://www.apexauctions.co.uk/#!/itemDetails/419/37888 (it’s missing the word auction from inside the URL)

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

[[redirects]]
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?

2

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.

3

No.

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.

URL {
  hash: "#!/itemDetails/419/37888"
  host: "www.apexauctions.co.uk"
  hostname: "www.apexauctions.co.uk"
  href: "https://www.apexauctions.co.uk/auction/#!/itemDetails/419/37888"
  origin: "https://www.apexauctions.co.uk"
  password: ""
  pathname: "/auction/"
  port: ""
  protocol: "https:"
  search: ""
  searchParams: URLSearchParams(0)
  username: ""
}
1 Like