18

I am having frustration between Firefox and IE, well mostly Firefox as it is automatically decoding a parameter in the hash before I can work with it in Javascript. IE does not automatically decode the url thus not giving me reading errors.

My problem is similar to this one except I am not using ASP.NET ASP.NET MVC automatically decoding JSON-encoded parameters from AJAX

So if I take a url like example.com/#question=!%40%23%24%25^%26*(

whereas the "!%40%23%24%25^%26*(" was encoded using encodeURIComponent, in IE when I access the hash it will be left as "!%40%23%24%25^%26*(", however in firefox, when I access the hash it is automatically decoded into "!@#$%^&*("

The problem with this is that in my script I am using decodeURIComponent to decode the encoded value, which is fine if the string is indeed encoded. Since it is already decoded in Firefox, it gives me a malformed URI sequence error, and IE does not give me any errors at all.

How can I fix this?

Community
  • 1
  • 1
Alex
  • 373
  • 1
  • 2
  • 7

5 Answers5

19

After searching I found out that this is a cross browser problem, and it is better to use location.href.split("#")[1] instead of window.location.hash

ThiefMaster
  • 310,957
  • 84
  • 592
  • 636
Alex
  • 373
  • 1
  • 2
  • 7
  • Thanks very much for this. I've just run into the same problem in Fx (Chrome is fine) and location.href.split("#!")[1] worked for me too. – meloncholy May 11 '11 at 13:08
  • 1
    Doesn't seem like Firefox is going to fix this anytime soon either. They've been discussing the bug since 2002 :( https://bugzilla.mozilla.org/show_bug.cgi?id=135309 and https://bugzilla.mozilla.org/show_bug.cgi?id=483304 – gregers May 12 '14 at 09:57
  • Firefox is allowing "#" inside the hash string, so it may be more bulletproof to so `window.location.hash.split("#").splice(1).join("#")`. – fourthnen May 21 '15 at 19:32
1

This is a really old question, but the underlying problem is still not solved. Firefox encodes something that other browsers don't.

Out of frustration, I had to create an entirely different approach and actually make the algorithm independent of whether the string was encoded or not.

I hope this solution finds those who need it:

function encodeOnce(text) {
  var doubleEncoded = encodeURIComponent(text);
  // only dive into it if there are any encoded strings...
  if (doubleEncoded.indexOf('%') != -1) {
    // reverse replace all % signs
    doubleEncoded = doubleEncoded.replace(/%25/g, '%');
    // if this is not equal to the original string, ...
    if (doubleEncoded != text) {
      // ... that means there was something to encode
      text = doubleEncoded;
    }
  }
  return text;
}

So then you can do this:

solution = encodeOnce(window.location.hash.slice(1));

What do you think?

Swiss Mister
  • 3,260
  • 2
  • 20
  • 42
1

This is actually what you want to use: 

decodeURI(window.location.hash.substr(1))

Indeed window.location.href.split("#!")[1] does not get decoded by FF automatically (at least today).

dbrin
  • 15,525
  • 4
  • 56
  • 83
  • `window.location.hash` is actually the root of the problem, so this won't work. But it's how it *should've* been... – gregers May 12 '14 at 11:04
0

The answer above works except for cases where your url contains more than one #. This should handle all cases:

var hash = "";
var indexOfHash = location.href.indexOf("#");
if (indexOfHash > -1) {
    hash = location.href.substring(indexOfHash);
}

Also, it seems like this should be fixed in Firefox soon. Just hit the nightlies:

https://bugzilla.mozilla.org/show_bug.cgi?id=378962

Breck
  • 670
  • 2
  • 7
  • 22
0

I had this problem. I solved it with this solution:

var currentLocation = document.location.hash;
var decodedLocation = decodeURI(currentLocation);
Peter
  • 1,674
  • 4
  • 27
  • 44
Ghadir Farzaneh
  • 429
  • 5
  • 6