Read more

sessionStorage: Per-window browser storage

Arne Hartherz
May 14, 2015Software engineer at makandra GmbH

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).
Illustration web development

Do you need DevOps-experts?

Your development team has a full backlog? No time for infrastructure architecture? Our DevOps team is ready to support you!

  • We build reliable cloud solutions with Infrastructure as code
  • We are experts in security, Linux and databases
  • We support your dev team to perform
Read more Show archive.org snapshot

MDN Show archive.org snapshot 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:

// 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/ Show archive.org snapshot

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.
Posted by Arne Hartherz to makandra dev (2015-05-14 11:24)