simulating HTML5 history on IE8+

For my current employer I help in building a heavy javascript based website/application. Using a javascript-based site, with a lot of ajax, you have to make sure the user can still use the back button without breaking the experience.

So we used the HTML5 history, and tested that on Firefox and chrome and it worked just fine.

Of course, our first client is using IE9, and it breaks completely.

The most famous library to port HTML5 history behaviour to all browsers is history.js. Unfortunately I encountered a few very specific issues with it:

• it uses statechange event, so it is triggered when pushing or popping a new state, and I can't tell which change it is. I am only interested in the pop state. This is akward, but fixable.
• we are building a SPARQL browser, so the url's we build contain RDF identifiers, which are URI's. History.js just can't handle that. It will unescape the uri's, and thus break the built url and stored state as well. This was not simply fixable at all. It was supposedly fixed in the dev-branch, but even that did not work

So I had to go looking for an alternative, with the following characteristics:

• support the same API as the HTML5 history, or as close as possible
• allow to build urls containing escaped uri's
• and of course: work on IE9 and up

And luckily, I found that library: HTML5-History-API, which is an exact implementation of the history API.

The only change was my popstate event (and include the javascript library, of course). Before it was implemented as follows (coffeescript) :

  window.addEventListener "popstate", (e) -\> 
    state = window.history.state 
    state = event.state 
  if state 
    if state.query != undefined 
      update(state.query)

and now it looks like:

  window.addEventListener "popstate", (event) -\> 
    event = event || window.event 
    state = event.state 
    if state 
      if state.query != undefined 
        update(state.query)

And then my code just worked on IE9! Awesome :)

Recent comments

• sonsun on Removing VBA Password in AutoCAD 04/05/23
• cccc on [Bootstrap 4] Closing a modal programmatically 28/06/22
• Rollins Duke on Removing VBA Password in AutoCAD 06/05/22
• Greg Tarsa on [rails 4.1] when the rails command just hangs 12/03/22
• gfbh tg on starting a new rails3 site using rspec2 and jquery 01/02/22

Tags