The read-only sessionStorage property accesses a session Storage object for the current origin. sessionStorage is similar to localStorage; the difference is that while data in localStorage doesn't expire, data in sessionStorage is cleared when the page session ends.
- A page session lasts as long as the browser is open, and survives over page reloads and restores.
- Opening a page in a new tab or window creates a new session with the value of the top-level browsing context, which differs from how session cookies work.
- Opening multiple tabs/windows with the same URL creates
sessionStoragefor each tab/window. - Closing a tab/window ends the session and clears objects in
sessionStorage.
Data stored in sessionStorage is specific to the protocol of the page. In particular, data stored by a script on a site accessed with HTTP (e.g., http://example.com) is put in a different sessionStorage object from the same site accessed with HTTPS (e.g., https://example.com).
The keys and the values are always ' in the UTF-16 DOMString format, which uses two bytes per character. As with objects, integer keys are automatically converted to strings.
Syntax
myStorage = window.sessionStorage;
Value
A Storage object which can be used to access the current origin's session storage space.
Exceptions
SecurityError- The request violates a policy decision, or the origin is not a valid scheme/host/port tuple (this can happen if the origin uses the
file:ordata:scheme, for example). For example, the user may have their browser configured to deny permission to persist data for the specified origin.
Examples
Basic usage
// Save data to sessionStorage
sessionStorage.setItem('key', 'value');
// Get saved data from sessionStorage
let data = sessionStorage.getItem('key');
// Remove saved data from sessionStorage
sessionStorage.removeItem('key');
// Remove all saved data from sessionStorage
sessionStorage.clear();
Saving text between refreshes
The following example autosaves the contents of a text field, and if the browser is refreshed, restores the text field content so that no writing is lost.
// Get the text field that we're going to track
let field = document.getElementById("field");
// See if we have an autosave value
// (this will only happen if the page is accidentally refreshed)
if (sessionStorage.getItem("autosave")) {
// Restore the contents of the text field
field.value = sessionStorage.getItem("autosave");
}
// Listen for changes in the text field
field.addEventListener("change", function() {
// And save the results into the session storage object
sessionStorage.setItem("autosave", field.value);
});
Note: Please refer to the Using the Web Storage API article for a full example.
Specifications
| Specification | Status | Comment |
| HTML Living StandardThe definition of 'sessionStorage' in that specification. | Living Standard |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
sessionStorage
|
Chrome
Full support 5 |
Edge
Full support 12 |
Firefox
Full support 2 |
IE
Full support 8 |
Opera
Full support 10.5 |
Safari
Full support 4 |
WebView Android
Full support ≤37 |
Chrome Android
Full support 18 |
Firefox Android
Full support 4 |
Opera Android
Full support 11 |
Safari iOS
Full support 3.2 |
Samsung Internet Android
Full support 1.0 |
Legend
- Full support
- Full support
See also
Window.sessionStorage by Mozilla Contributors is licensed under CC-BY-SA 2.5.