Site url:
https://reliable-conkies-859a73.netlify.app/
Public repo:
https://github.com/leocesar3dofficial/meu-site-dinamico
I am creating a SPA with javascript only, when you go to the root url it works fine, even if I hit a direct link like this:
https://reliable-conkies-859a73.netlify.app/contato
it works fine too, but when I try to access the direct link with a sub path:
https://reliable-conkies-859a73.netlify.app/artigo/titulo-do-artigo-2
it returns the index.html content to all other assets, CSS and Javascript files as shown bellow:
I am redirecting all urls using the _redirect file attribute: /* /index.html 200
This is a strange behavior, to serve the static files overwriting their content with the index.html code content.
What can I do to solve this issue, it is imperative that the site users can hit a url directly without any problem.
Thank you.
@leocesar This is occuring because your file paths aren’t correct for what you’re trying to do.
The Netlify redirect specified returns the /index.html in situations that would have otherwise been a 404.
So it’s not that it is returning the file instead of properly returning the assets, it’s providing the index.html because the paths are wrong.
A path of js/themes.js is a relative path.
If you’re currently on artigo/titulo-do-artigo-5, it’s going to mean artigo/js/themes.js (which obviously doesn’t exist).
You can see it doing exactly that:
Your file is actually at /js/themes.js
Change your file references to be root relative, so that they start with a /.
/js/themes.js
/js/routes.js
/js/articleCard.js
/js/states.js
/js/router.js
/css/styles.css
etc
First of all, thank you very much Nathan!
Your answer is the peak of professionalism. It is direct, thorough and without messing around.
The relative/absolute path error made me feel stupid.
It was simple as you described in your solution.
In the index.html file:
Before: script src=“js/themes.js”
After: script src=“/js/themes.js”
Made the changes and the SPA worked as intended. Identified other bugs with asynchronous calls and my prototype is working perfectly for my use case.
Thank you again Nathan for the fast and precise answer!
