Search code examples
backbone.jspushstatebackbone-routing

How can I get consistent PushState links between IE8 and IE10/modern browsers with backbone.js?


I'm in Chrome, I copy my url: "http://www.example.com/a/123456789" and paste it into IE8. It works fine, because my routes are set up right.

If I then navigate somewhere else, I get the IE8 fallback url as expected: "http://www.example.com/a#a/123456789" (note the hash), all is well.

Here's the problem...

Now if I copy my link with the hash (http://www.example.com/a#a/123456789) and paste it into a modern browser, it dumps me to http://www.example.com/a#a.

Anyone have experience with this behavior?


Solution

  • I came up with a little workaround for this, so I figured I would share it incase it can help anyone else...

    // Make urls copied from IE8 work when pasted in modern browsers
    if (history.pushState && location.hash.match(/#a{1}/)) {
        location.href = location.href.replace('a#a', 'a');
    }
    

    Basically, I just checked to see if the browser supported push state, and if the hash we are looking for is in the URL. Since our hashes are the same as what we use in pushState, a quick replace is all it took.