11

I'm trying to do a mega-simple setItem and getItem using HTML5 local storage. It just doesn't seem to work though. This works:

$(document).ready(function () {
  localStorage.setItem('keyA', 'valueA');
  var testA = localStorage.getItem('keyA');
  alert(testA);
});

It outputs an alert box saying 'valueA'. But when I comment out line 2 (which sets the item value) and refresh the page it just alerts 'null'.

Why is the value not persisting? It's like it's just not actually getting stored at all.

The browser is Firefox 6, so no problem there. Could it be something to do with calling it in the jquery document.ready? I've googled but couldn't see anything about that.

If anyone could get me over this initial hurdle I'd be most grateful, thanks!

Dan
  • 5,836
  • 22
  • 86
  • 140
  • I cannot reproduce on Chrome. – pimvdb Sep 10 '11 at 20:15
  • Hmm... works for me too in Chrome, but not in Firefox 6!? – Dan Sep 10 '11 at 20:25
  • Can anyone else try this in Firefox 6.0.2 (latest version)? I'm starting to think there's either a different way to do this in this version of Firefox or it's a bug :( I've tried so many different examples of local storage but none of them seem to persist in Firefox 6.0.2. – Dan Sep 10 '11 at 21:15
  • I had 6.0 installed and it worked. Then updated to 6.0.2 and the value was still there... So it even survived the update for me. – pimvdb Sep 10 '11 at 21:20

1 Answers1

14

Okay, after a lot of frustration I have the solution. Basically, I was running this locally just from the filesystem as a 'quick' proof of concept. It didn't work in Firefox nor in IE9 but it did work in Chrome.

What I ended up doing was trying this on a real domain, and that seems to have done the trick.

So the conclusion I can draw is that localStorage in Firefox (6.0.2 at least) and IE9 does not work when run on a file-system path. It does in Chrome. Firefox and IE9 require a 'proper' domain to run from, presumably because they are more strict than Chrome in the way they associate the localStorate object to a 'domain' (in Chrome it doesn't need to be a domain as such).

I hope this has helped people as it's frustrated the hell out of me! :)

Dan
  • 5,836
  • 22
  • 86
  • 140
  • 2
    These might be of interest: [Is “localStorage” in Firefox only working when the page is online?](http://stackoverflow.com/questions/1492942/is-localstorage-in-firefox-only-working-when-the-page-is-online) and [Bug 507361 - localStorage doesn't work in file:/// documents](https://bugzilla.mozilla.org/show_bug.cgi?id=507361). – Felix Kling Sep 11 '11 at 09:23
  • Still useful in 2019 :) Had the same problem with Safari on MacOS. While Chrome and Firefox stored my token persistently, it got always deleted on Safari when navigating to another page or simply doing a refresh. – Greg Holst Aug 30 '19 at 10:14
  • I can confirm it also doesn't work on custom domain names (eg. having example.test pointing to 127.0.0.1 in your hosts file). Using Firefox 84.0 (64-bit) on Ubuntu 20.04 – Andrey Tsarev Jan 05 '21 at 15:29