1

I am building a map-based single-page application that changes its URL as the user browses. My main problem is that Google Chrome's Lighthouse doesn't like the fact that I'm using an ErrorDocument 404 Apache rule to redirect to the root page and keep the URL. I think that a 404 error isn't great either for SEO, but I'm just guessing.

I would like Apache to redirect my users to / if the requested URL isn't a file, and send a fitting status_code (301 rather than 404), and I need to be able to access the user's original URL with JavaScript once the page loads.

# This works as intended except that it doesn't send a 301 code
ErrorDocument 404 /

# This works as intended except that JavaScript cannot access the user's original URL
RewriteEngine On
RewriteCond %{REQUEST_URI} !\.[a-z]{2,4}$
RewriteRule ^(?!\/$).+ / [R=301,L]

# This redirects everything, including existing script, image, or style files back to / with a 301 code
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(?!\/$).+ / [R=301,L]
Tim
  • 71
  • 6

1 Answers1

0

This answer may be what you need https://stackoverflow.com/a/12254270/4243067

However, you may be interested in the client router libraries that rely on the history API to change the client side state without calling the server. For vanilla JS, check this post https://dev.to/rohanbagchi/how-to-write-a-vanillajs-router-hk3

Here is a famous one for react apps https://reactrouter.com/en/main/start/concepts

Benjam
  • 1,401
  • 2
  • 16
  • 22