# Preventing Bubble to Handle 404 Page (for Single Page Application)

**URL:** <https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740>\
**Category:** Need help\
**Created:** [September 18, 2017, 7:26pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740 "2017-09-18T19:26:00Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![ernie](https://avatars.discourse-cdn.com/v4/letter/e/eb8c5e/32.png) [@ernie](https://forum.bubble.io/u/ernie)\
**Post date:** [September 18, 2017, 7:26pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/1 "2017-09-18T19:26:00Z")

</div>

Say we have this URL:

`www.site.com/search/recent`

I understand this URL will navigate users to a “search” page I make in Bubble and ignore the `/recent` part (i.e. Bubble won’t send users to 404 page). Can I make the same behavior for the index page as well? It seems to me Bubble sees this URL and send me to 404 page without the “search” page.

So the question would be - How do we make the index page to handle any URL path?

* * *

Update: I thought I should give a little more context.

I am making a single page application. When users come to the site from the home URL (`www.site.com/`) It’s not an issue. However, when as soon as they type in `www.site.com/{any pathname}` Bubble redirects to 404 page unless there is a page with the same name.

---

<div class="post-metadata">

**Author:** ![sridharan.s](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/sridharan.s/32/17881_2.png) [@sridharan.s](https://forum.bubble.io/u/sridharan.s)\
**Post date:** [September 18, 2017, 7:47pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/2 "2017-09-18T19:47:40Z")

</div>

2 ideas. Both hacks:

1. Make the 404 page the same as your homepage.
2. Set a workflow on the 404 page to send users to the homepage. Keep the page blank so that user’s don’t notice the redirect.

---

<div class="post-metadata">

**Author:** ![ernie](https://avatars.discourse-cdn.com/v4/letter/e/eb8c5e/32.png) [@ernie](https://forum.bubble.io/u/ernie)\
**Post date:** [September 18, 2017, 8:45pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/3 "2017-09-18T20:45:39Z")

</div>

Hi @sridharan.s Thanks for your thoughts. I tried the second method, but then I would have to add query parameters in the index page to catch where the user initially wanted to go. Otherwise, a user who enters `site.com/login` will end up being in `site.com` So this is what I tried:

1. User enters `site.com/login`
2. User goes to 404 but is redirected back to index with `?redirect=login`
3. User goes to `site.com?redirect=login`
4. Replace the above URL with `site.com/login`
5. Associated elements show up based on the URL path

Which works, but that looks very hacky with unnecessary network trips…

I am not sure if I understood your first option. Are you saying visually making the 404 page same as my homepage?

---

<div class="post-metadata">

**Author:** ![sridharan.s](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/sridharan.s/32/17881_2.png) [@sridharan.s](https://forum.bubble.io/u/sridharan.s)\
**Post date:** [September 18, 2017, 9:07pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/4 "2017-09-18T21:07:41Z")

</div>

Ohh, I think I get what you’re trying to do now. You want to have a single page app, but you want people to be able to link to specific places within that app, such as the login page. Correct?

If so, the way to do that is with URL parameters. Example: [yourdomain.com/?view=login](http://yourdomain.com/?view=login)

This will take you to the homepage, and you can retrieve the value of the url parameter view on the homepage and use that to display the login page.

---

<div class="post-metadata">

**Author:** ![ernie](https://avatars.discourse-cdn.com/v4/letter/e/eb8c5e/32.png) [@ernie](https://forum.bubble.io/u/ernie)\
**Post date:** [September 19, 2017, 7:07am UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/5 "2017-09-19T07:07:16Z")

</div>

Yes! That is what I am going for, except I’d like URL to be path-based(i.e. `/structure/sub-structure/.../`) instead of parameter-based. So… I am basically looking for ways to get rid of above step 2, 3, and 4.

Since many bubblers attempt to make a single page app, I am hoping someone has figured this out already? 🙂

---

<div class="post-metadata">

**Author:** ![sridharan.s](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/sridharan.s/32/17881_2.png) [@sridharan.s](https://forum.bubble.io/u/sridharan.s)\
**Post date:** [September 19, 2017, 3:17pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/6 "2017-09-19T15:17:48Z")

</div>

Any reason you’re trying to break web conventions by using paths, but only having 1 page?

---

<div class="post-metadata">

**Author:** ![ernie](https://avatars.discourse-cdn.com/v4/letter/e/eb8c5e/32.png) [@ernie](https://forum.bubble.io/u/ernie)\
**Post date:** [September 20, 2017, 1:43pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/7 "2017-09-20T13:43:43Z")

</div>

Well, I want spontaneous, smooth experiences. Single page application doesn’t always have to be parameter-based. In fact, many web services like Spotify are SPAs, but their URLs are path-based (e.g. [https://open.spotify.com/browse/featured](https://open.spotify.com/browse/featured), [https://open.spotify.com/search/recent](https://open.spotify.com/search/recent), …) Path-based URLs look much better to me. But more I dig into it, more I realize it’s not a feasible solution in the Bubble’s routing system… ☹

---

<div class="post-metadata">

**Author:** ![sridharan.s](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/sridharan.s/32/17881_2.png) [@sridharan.s](https://forum.bubble.io/u/sridharan.s)\
**Post date:** [September 21, 2017, 5:16pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/8 "2017-09-21T17:16:47Z")

</div>

Yeah, seems hard in Bubble and perhaps not even do-able. Also seems like it’d be more complex / expensive to build it that way with custom code than simply using URL parameters. So, probably not worth the investment until you’ve got lots of traction and money, imo.

---

<div class="post-metadata">

**Author:** ![ernie](https://avatars.discourse-cdn.com/v4/letter/e/eb8c5e/32.png) [@ernie](https://forum.bubble.io/u/ernie)\
**Post date:** [September 25, 2017, 2:22am UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/9 "2017-09-25T02:22:58Z")

</div>

Yep. After many days of struggle, I decided not to go with this approach. Workarounds for underlying routing structure sounds pretty risky 🙂 anyways thanks for help!

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/bubble/original/3X/2/8/2847faa74692c2ffa5d939d3dc3724cdd060d247.png) [@system](https://forum.bubble.io/u/system)\
**Post date:** [November 27, 2017, 7:26pm UTC](https://forum.bubble.io/t/preventing-bubble-to-handle-404-page-for-single-page-application/17740/10 "2017-11-27T19:26:02Z")

</div>

Closed on November 27, 2017, 7:26pm UTC

This topic was automatically closed after 70 days. New replies are no longer allowed.
