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

Need help
1

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.

2

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.
3

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?

4

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

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.

5

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? :slight_smile:

6

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

7

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/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… :frowning:

8

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.

9

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