16

I would like to use the location.hash to encode the state of my client app, such that users can easily bookmark and/or share the app in its complete state using the URL.

There are a number of (outdated) topics on the max length of a url, particularly limits in internet explorer. However it is not clear what the maximum size of the location.hash is. Because the hash only exists in the client, limitations of http or servers are not relevant.

I made a simple jsfiddle to test this: http://jsfiddle.net/Jz3ZA/. In both Chrome and Firefox (Ubuntu 12.04) hashes up to 50K seem to work. Does this mean I could use them to store state or am I overlooking other limitations?

3
  • 2
    There's no standard for size restrictions on URLs at all, so the hash can theoretically be any length, but you can't trust what particular browsers will do (especially IE). Apr 27, 2013 at 0:54
  • Why don't you store the state in a server?
    – Blender
    Apr 27, 2013 at 1:11
  • I have run your fiddle on Internet Explorer 11 and it fails at hash length 3000 Nov 26, 2016 at 8:54

3 Answers 3

14

Based on your JS Fiddle (well a modified version of it http://jsfiddle.net/Jz3ZA/18/ (see code example below)), you can test lots of browsers to get an effective baseline.

  • Chrome: 50K+
  • Firefox: 50K+
  • Safari (iOS): 50K+
  • Internet Explorer 11: Fails between 2,025 and 2,050
  • Microsoft Edge: Fails between 2,025 and 2,050

Thus regardless what other browsers do support, if you need to support Microsoft Edge or IE11 then you'll need to stay under 2,025 character hashes. Since IE (and thus I'm guessing Edge) has historically had URL length limitations... this may also depend on the length of your base URL.

function testall(){
  var sizes = [10,100,1000,2000,2025,2050,2100,2250,2500,2750,3000,4000,5000,10000, 50000];
  for(var i=0;i<sizes.length;i++){
    var n = sizes[i];
    if(!testhash(n)){
        alert("test failed at hash of length: " + n);
        return;
    }
  }
  alert("all tests passed");  
}

function testhash(n){
    var somestring = "#" + makestring(n);
    window.location.hash = somestring; 
    var success = (window.location.hash == somestring); 
    return success
}    

function makestring(n){
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

    for(var i=0;i<n;i++){
        text += possible.charAt(Math.floor(Math.random() * possible.length));
    }
    return text;
}
$("button").on("click", testall);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<button>Test!</button>

2
  • Firefox seems to support 1M nowadays, Chromium did not break at 40M. Since IE and old non-blink Edge are becoming irrelevant the practical limits has likely been lifted up. I did not test Safari and mobile browsers though. Sep 22, 2022 at 8:40
  • 1
    Agreed, but emphasis on becoming irrelevant... some of us still need to support IE... :-(
    – scunliffe
    Sep 23, 2022 at 14:21
-5

Such a misleading explanation. Hash has simply no limits of size and feel free to use it as much as you like. Just remember that its not a url part.

1
  • 3
    I don't think this is true. Wikipedia says: The fragment identifier introduced by a hash mark # is the optional last part of a URL for a document. Sep 27, 2014 at 8:57
-6

What is the maximum length of a URL in different browsers?

This typically does not include the hash part though, so I don't think there's a standard.

I would like to point out that the fragment identifier is typically used to identify a fragment of a document, and shouldn't be used to store the entire state of an app. You should use localstorage instead.

If you would like the ability to share or bookmark, consider storing the app's state on the server-side, and use the fragment identifier to store the id of the stored state.

1
  • 3
    The question was explicitly about the hash part, so this doesn't answer the question. May 6, 2013 at 3:05

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.