history.js is rewriting urls with hash tags

Question

I've got jquery history.js working but I'd like to force hash tags to be used. I've tried setting History.options.html4Mode=true but this doesn't work.

The reason I need this is that upon page refresh, the url in the browser is not valid. I'm working around a strange backend and require these urls.

What happens when I use hash tags is:

1) Initial state: http://localhost/<script_path>/<param1>?get&file=<html_file>

2) History.pushSate(null, null, http://<script_path/<parm>?get&file=<html_file>#/<parm>/<parm>?<more parms>

3) After History.pushState: http://localhost/<parm>/<parm>?<more parms>

edit: forgot to mention that if I remove the hash it appends everything after the file perfectly.

edit 2: seems to be some interaction between history and jquery. I think history is pushing the url i give it. Stepping through it right now.

edit 3: solved. historyjs won't work for this project- i have to use location.hash

Answer 1

If all you are doing is adding a hash onto the existing URL, you should set location.hash. Use pushState for changing the pathName without reloading the page.

UPDATE: history.js uses hashes in order to support older browsers. So passing in a hashed URL to history.js simply doesn't make sense (eg. what happens on older browsers?).

My suggestion is to use another query string parameter to hold the new URL. You will need to encode any path-like values:

var path2 = "/script_path/param1?more=params&even_more=params";
var newUrl = "/script_path/param1?get&file=html_file&path=" + encodeURI( path2 );
History.pushSate(null, null, newUrl);

... or you could take advantage of the API (no encoding needed):

var path2 = "/script_path/param1?more=params&even_more=params";
var newUrl = "/script_path/param1?get&file=html_file";
History.pushSate({path: path2}, null, newUrl);