Posted about 2 years ago. Visible to the public. Repeats.

sessionStorage: Per-window browser storage

All major browsers (IE8+, FF3.5+, Safari 4+, any Chrome) support sessionStorage, a JavaScript storage object that

  • survives page reloads and browser restores,
  • but is different per new tab/window (in contrast to localStorage which is shared across all tabs).

MDN says:

The sessionStorage object is most useful for hanging on to temporary data that should be saved and restored if the browser is accidentally refreshed

Demo

Example usage:

Copy
// Save data to the current session's store sessionStorage.setItem("username", "John"); // Access some stored data alert( "username = " + sessionStorage.getItem("username"));

As a demo, check out this jsFiddle which will assign a random number https://jsfiddle.net/8zb8p3zu/embedded/result/

Caveats

  • sessionStorage can only store string keys and values (like localStorage). If you need to store structured data you need to use JSON.stringify(object) and JSON.parse(string).
  • sessionStorage is unavailable (null) in private browsing mode on Safari and the default Android WebKit browser.
  • In Chrome, duplicating a tab (e.g. by middle-clicking the reload button) will cause the new tab to use the same sessionStorage.
  • In Chrome, tabs opened via window.open will also use the same sessionStorage.

Once an application no longer requires constant development, it needs periodic maintenance for stable and secure operation. makandra offers monthly maintenance contracts that let you focus on your business while we make sure the lights stay on.

Author of this card:

Avatar
Arne Hartherz
Last edit:
4 months ago
by Henning Koch
About this deck:
We are makandra and do test-driven, agile Ruby on Rails software development.
License for source code
Posted by Arne Hartherz to makandropedia