How to return to bookmarked hash-bang URLs within a single page application?

582 Views Asked by At

I understand the HTML5 History API and how it enables to back and forward buttons within a single page application (SPA).

But given the URL displayed by the API, how can I return to application state when given the faux URL via a bookmark or emailed URL? For instance...

If my SPA loads from http://dacracot.org/myApp, the user may navigate around until the URL as morphed to http://dacracot.org/myApp#!ec2f209f25e11. The user decide they want this to be their start point within the SPA from now on and bookmarks it. Furthermore, they think it is a good start point for their coworkers and email the URL to them.

So when my SPA loads, I can trap the hash-bang marker #!ec2f209f25e11, but now what? What mechanism do I have available that puts them at the same click stream that they expect? Do I have to create a route table with every display option? This (I hope) is not my only option.

1

There are 1 best solutions below

1
Quentin On

Do I have to create a route table with every display option?

More or less.

Since the fragment identifier is only available on the client, you need client-side logic that can use the URL to determine the state that the page should be in when the user asks to load it.