--- title: "How to Create Better Redirect Rules for SPAs with Netlify" description: "Redirects are handy to manage how browsers serve content. Learn how to use Netlify redirects in SPAs effectively so users get content predictably." source: "https://www.netlify.com/blog/2020/04/07/creating-better-more-predictable-redirect-rules-for-spas/" last_updated: "2026-07-14T23:29:32.000Z" --- On Netlify, ensuring clean URLs is a matter of adding the following rule to the `_redirects` file: ``` /* /index.html 200 ``` This rule ensures that every path successfully resolves to `index.html` and the client has full control over the routing logic. Generally, redirect rules are followed unless otherwise specified; If no conditional such as a role based or a GeoIP based redirect is present, Netlify’s proxy server adheres to all redirect rules present. Under the hood, Netlify distinguishes and categorizes redirect rules as “forced” and “unforced” for maximum granularity. Unforced rules resolves a path to a matching file. In other words, if a static file exists under the initial path being redirecting from, Netlify will serve that file in place of applying that rule. To further illustrate this concept, let’s look at a Netlify redirects in action. Say we had the following redirect rule in our `_redirects` file or the equivalent redirect in our `netlify.toml` file: ``` /docs/routing/redirections /docs/routing/redirects 301 ``` ``` [[redirects]] from = "/docs/routing/redirections" to = "/docs/routing/redirects" status = 301 ``` If Netlify finds an `index.html` page under the path `/docs/redirections` it will serve that file up in place of handling the redirect. This feature is known as [file shadowing](https://docs.netlify.com/routing/redirects/rewrites-proxies/#shadowing). Broadly speaking, this behavior tends to be preferred when setting up redirect rules and routing in SPAs. In the event that you’d rather enforce the rules and explicitly redirect regardless of whether a file exists at that path or not, Netlify offers “forced” rules. Forced rules provide a way to override Netlify’s implicit file shadowing and ignore existing content that matches a path. As the name implies, forced rules always take effect no matter the scenario. Using the above example, if Netlify finds an `index.html` page under the path `docs/redirections` it will ignore this file and instead redirect to the `index.html` file under `/docs/redirects`. To enable forced redirects, all you’ll need to do is add a `!` to the end of your redirect rule in the `_redirects` file or a `forced=true` attribute in the specific redirects portion of the `netlify.toml` file. ``` /docs/routing/redirections /docs/routing/redirects 301! ``` ``` [[redirects]] from = "/docs/routing/redirections" to = "/docs/routing/redirects" status = 301 force = true ``` ## Well, hasn’t this always been the case? Despite our best efforts, this behavior hasn’t always been as predictable as we would’ve liked. Due to internal technical implementations over the last few years, the encoded conditions driving redirects changed such that forced and unforced rules did not behave as expected. This led to unpredictable, sometimes even undesired behavior where redirects were forced under certain conditions and not others. In an effort to maintain consistency and predictability, we’ve made updates to redirects so only rules with explicit force configurations will be treated as such. This change will take effect as of April 7th. ## Checkity check your redirects Redirects are handy ways to manage how browsers identify and serve content. Mapping redirect rules accurately means that users will always have a predictable browsing experience and is key to enhancing overall user experience. With the new changes taking effect, be sure to check your site’s redirects to make sure they behave the way you expect! To recap, here is the behavior between “forced” and “unforced” rules. ### Given the following _unforced_ redirect rule: ``` /docs/routing/redirections /docs/routing/redirects 301 ``` The following file will load: ``` /docs/routing/redirections/index.html ``` ### Given the following _forced_ redirect rule: ``` /docs/routing/redirections /docs/routing/redirects 301! ``` The following file will load: ``` /docs/routing/redirects/index.html ``` If you have questions about how Netlify handles redirects, be sure to check out \[the corresponding post related to redirects\]([Changed behavior in redirects – Updates – Netlify Community](https://community.netlify.com/t/changed-behavior-in-redirects/10084)) in our community forum! ### Share - [X (fka Twitter)](https://twitter.com/intent/tweet?text=Creating better, more predictable redirect rules for SPAs&url=https://www.netlify.com/blog/2020/04/07/creating-better-more-predictable-redirect-rules-for-spas//) - [LinkedIn](https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww.netlify.com%2Fblog%2F2020%2F04%2F07%2Fcreating-better-more-predictable-redirect-rules-for-spas%2F%2F) - [Facebook](https://www.facebook.com/sharer.php?u=https://www.netlify.com/blog/2020/04/07/creating-better-more-predictable-redirect-rules-for-spas//) - [Bluesky](https://bsky.app/intent/compose?text=Creating better, more predictable redirect rules for SPAs+https://www.netlify.com/blog/2020/04/07/creating-better-more-predictable-redirect-rules-for-spas//) * * * ### Tags - [Redirects](/blog/tags/redirects/) ## Keep reading ![](/images/blog-fallback-thumbnail.svg) Guides & Tutorials January 16, 2019 [ ### Redirect Rules for All; How to configure redirects for your static site ](/blog/2019/01/16/redirect-rules-for-all-how-to-configure-redirects-for-your-static-site/) - ![Profile picture of Netlify team](/_astro/2ded7a52db41c7613be0baa648ac9bf9c1e8a985-300x300_DNhVu.svg) Netlify team ![](/images/blog-fallback-thumbnail.svg) Guides & Tutorials January 31, 2019 [ ### Restrict access to your sites with role based redirects ](/blog/2019/01/31/restrict-access-to-your-sites-with-role-based-redirects/) - ![Profile picture of Netlify team](/_astro/2ded7a52db41c7613be0baa648ac9bf9c1e8a985-300x300_DNhVu.svg) Netlify team ## Recent posts News & Announcements July 14, 2026 [ ### More headroom, a lower per-credit rate, and a bill you can predict: introducing new Pro plan tiers ](/blog/new-pro-plan-tiers) - ![Profile picture of Gehrig Kunz](/_astro/b4e9f58d914d1334ea70d53ea55a1f26b26f1445-512x512_17SwOI.webp) Gehrig Kunz News & Announcements July 13, 2026 [ ### Netlify inside of Claude Design ](/blog/netlify-inside-of-claude-design) - ![Profile picture of Sean Roberts](/_astro/bbf2243f8171dbddd80ab2103622106cef84d125-512x512_Z1d2LKE.webp) Sean Roberts News & Announcements June 25, 2026 [ ### Netlify Functions, designed for Agent Experience ](/blog/netlify-functions-designed-for-agent-experience) - ![Profile picture of Eduardo Bouças](/_astro/52958f21e8450baf6d8e60302341a984e220c0cd-512x512_13VDlu.webp) Eduardo Bouças ![](/_astro/3f255b372fa958df35802666ee33b4609b2d71bd-1200x1586_1VtE2D.webp) ### How do the best dev and marketing teams work together? [Access the report](https://www.netlify.com/reports/2024-leadership-trend-report/access/)