[Support Guide] Direct links to my single page app (SPA) don't work

Last reviewed by Netlify Support - July 2025

If you’re building a Single Page Application (SPA), or an app that manages its own routes (url paths), you’ll want to add a _redirects file to your publish directory with the following line to take advantage of browser history pushstate:

/*    /index.html   200

You can read more information in our docs, which can be found here.

5 Likes
React App not accessible with direct links
Vue/nuxtJS slug: 404 on refresh
Only the homepage loads, but other routes are not working showing broken url
Netlify Forms and "Back to our site" with React returns me to a non-existent page
(SPA) Routes rendered with map() function give blank page on refresh
React-router urls don't work when refreshing or writing manually
Looks like you've followed a broken link or entered a URL that doesn't exist on this site. (I've read the support guide for this already)
I can only access my site through the root url but not through a specific route
Is it possible to create rewrite redirects via netlify.toml?
Custom domain's subpages not redirecting to GitLab subpages
How to generate my website
ReactJS SPA Reload Page Fails
ReactJS SPA Reload Page Fails
URL is not working
404 page not found after deploy a new page
I am getting error - Page not found
Root relative pages (custom domain) throw page not found
Deploying single page applications
On redirection to app getting Page not found
React-bootstrap Nav.Link
I'm deploying my react app but it only shows blank page
Direct links to pages other than landing page break layout
Not showing the page in subfolder when opening the link directly
React Netlify Deploy reload error
Netlify Forms with Vuepress Issue
SPA fallback document without rewrite
Page not found for route "/login"
Page not found for route "/login"
Can't access aux pages of React app after build
1 or 2 pages do not render without refreshing the page
Can't search by slugs when live on Netlify?
Can't deploy frontend alone, with frontend and backend in the same folder
Site deploys fine, but resources are failing to load
Why is the react deployment failing? Using "CI= npm run build" doesn't seem to be working
Ionic deployment problem
Splat redirect not working with Svelte framework (I read the guide)
Site cannot be accessed broken link or url that doesn't exist
Everything but my home page crashes on refresh
Links in a Single Page Application
Any path except homepage gives 404
Ajuda com site react
Vue SPA, redirect rules
Refresh of page breaks images path
Redirecting Url not working properly
Get and Post request 404 error
"Page Not Found ... broken link" while the link exists
Redirects using create react app
Calling an API fails when deployed with Netlify, works fine when served locally and image not loaded
Page Not Found on refresh
URL cannot be shared on social platforms, like messenger
Server error after successful deploy
Page Not Found after Auth0 redirect ( working fine on localhost)
Page Not Found after Auth0 redirect ( working fine on localhost)
Page Not Found after Auth0 redirect ( working fine on localhost)
I got 404 error on every page except the main pain
Route doesn't work on live site
Get 404 on all pages except landing page
404 code redirect
Pageview for single page applicatio
Netlify Website Working well except QR codes linked to the site result in 404 Page Not Found
Netlify making GET requests - undefined values
Netlify DNS connetion for domain and custom email
Deployed using Bolt.new when my site tried to process a stripe payment the redirect page gives 404
SPA redirects: [/* /index.html 200] captures everything (JS, CSS, etc.)
Deploy failed for earnest-cupcake-95c291
Problem with Images
Searching with Endpoints while entering manually throwing an error after successful deployment
Website's path is working if I access the home URL in sequence, but not if I just enter a particular path
Routing working locally but not when hosted by Netlify
404 errors after migration from Heroku to Netlify
Gatsby website - subpages don't load when navigated via direct url
Recaptcha not loading correctly
Gridsome: Router is working only when I refresh the page #weird
Problems with authentication services urls
Redirect don't work when you visit your site for the first time

I have seen people asking on twitter about this. A common question seems to be, “but how do you handle 404s this way?”

For single page applications which require all URLs to be routed to this index.html page so that they can handle the routing in JavaScript, that JavaScript logic is going to need to handle the 404s too. This is because the information about what routes resolve to what views is held in the JS. It needs to handle the behaviour for any missing views itself too.

3 Likes

That’s a great question! the issue is the same with an SPA regardless of where you host it since all requests are passed to the router. If you know all your routes then you can use netlify _redirects to send those specific routes that are used to your index.html, and all others can be handled with a 404 failover rule. Since the _redirects file needs to be there at the end of the build, you can generate a _redirects file based on your routes programmatically during the build process. That said, I don’t know anyone that does this. Google’s crawlers in theory are able to crawl SPA’s, but I don’t know how well that works, and anecdotally speaking , prerendering the page will still give you better results.

Or you can use a static site generator like Gatsby/React-Static or Gridsome/Nuxt (if you already use React or Vue)

2 Likes