When is sessionStorage actually cleared?

Question

I have some javascript that checks for an object in sessionStorage, and uses it to refill an input field. I use this to help users on my site if they leave the form unfinished and either navigate away or try to submit the form after their session has expired.

My understanding is that sessionStorage is NOT linked to a server session, it is linked to the browser, so whether I have a new session on the server or not is irrelevent.

This was supported when I was testing this initially a few months ago. However, it seems to no longer be the case, and when I clear my session cookie and reload my page, my sessionStorage is also cleared out. This is using both Chrome and Firefox.

I don't want to use localStorage as that could cause issues with shared computers, whereas sessionStorage will be wiped out when the browser windows is closed.

JS to get the value of my stored object:

JSON.parse(sessionStorage.getItem("draftPost") || null);

JS to save the value:

$("#wallText").on("change", function(){
    sessionStorage.setItem("draftPost", JSON.stringify(draftPost));
});

Various

It's explained in detail here: html.spec.whatwg.org/multipage/… – Swivel

And it's summarized briefly here: developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage – Swivel

From the latter page: Opening a page in a new tab or window will cause a new session to be initiated, which differs from how session cookies work. – Swivel

All of this is exactly how I understood it, but for some reason it doesn't appear to be how it is working for me right now. – Various

Your question isn't very clear. What exactly do you do, what are you expecting to happen, and what's happening instead? – Swivel

Just in closing this question. It turned out to be another developer decided to use local storage, and part of his code decided to clear it all rather than just the values he used. – Various

@Various That's a great gotcha to watch for, thanks for updating. – Aldarcy

I'm going to level with you all. I don't read lengthy specs. – Dowitcher

Answer 1

Session storage is cleared when the tab closes. It persists over page reloads and restores. See: https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

• Whenever a document is loaded in a particular tab in the browser, a unique page session gets created and assigned to that particular tab. That page session is valid only for that particular tab.
• A page session lasts as long as the tab or 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 sessionStorage for each tab/window.
• Duplicating a tab copies the tab's sessionStorage into the new tab.
• Closing a tab/window ends the session and clears objects in sessionStorage.

Note that the duplication of the tab does not seem to work in Firefox, it does however in Chrome.

Lourielouse

That's the same link I provided in my comment. But his question claims that it's not doing what he expected from reading that. – Swivel

what about for jquery form.submit() – Jung

For safari 14, when user tries tap on browser URL and hit enter. it will clear the session storage as well. it looks like it closes the tab. but actually you refreshed the same URL in the browser. – Miyamoto

Is it get deleted before window.unload function get called??? – Kay

ok, and when i have a tab with host foo.com and save data to sessionStorage, then go to abc.com and then click back button and i am again on foo.com, will the data persist? – Proficient

Answer 2

Something to bear in mind with sessionstorage on mobile safari.

As stated by Archived version of the Window.sessionStorage docs on MDN dated 2018:

Note: since iOS 5.1, Safari Mobile stores localStorage^{[sic - possible misprint of sessionStorage]} data in the cache folder, which is subject to occasional clean up, at the behest of the OS, typically if space is short.

This clean-up takes place all too frequently on mobile safari, and all sessionStorage variables are destroyed for all open tabs.

For example, having say 5 tabs open, and then loading a new page which has lots of javascript and css will cause the clean-up, destroying all sessionstorage variables.

However, localstorage variables are preserved.

Also, on safari, (i believe both desktop and mobile), in-private browsing will prevent using either localstorage or sessionstorage.

Odel

Rockmo, do you have a link to any iOS specific docs that describe that behavior? – Peisch

Answer 3

Two things might help you.

• It is similar to localStorage.
• The data is not persistent i.e. data is only available per window (or tab in browsers like Chrome and Firefox). Data is only available during the page session. Changes made are saved and available for the current page, as well as future visits to the site on the same tab/window. Once the tab/window is closed, the data is delete

Cherycherye

Answer 4

sessionStorage data is cleared when the session ends (hence the name, sessionStorage). Data in sessionStorage is kept until you close the browser. When you close the browser, all the data is deleted, with no way of getting it back (other than saving the data in databases). sessionStorage also cannot be edited with chrome extensions, so it's a great alternative to cookies.

More info: https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage, https://www.w3schools.com/jsref/prop_win_sessionstorage.asp

Cutshall

sessionStorage is not read only – Decern

Of course not, why would that be so? @Decern – Cutshall

sorry my mistake (I dont know how) but I thought I saw you say sessionStorage was read only – Decern

Answer 5

From archived Apple Developer docs. See the link below for more context.

Key-value storage allows you to store data locally, in either a session store or a local store. The localStorage and sessionStorage JavaScript objects are functionally identical except in their persistence and scope rules:

• The localStorage object is used for long-term storage. Data persists after the window is closed and is shared across all browser windows.
• The sessionStorage object is used for ephemeral data related to a single browser window. Data stored in the sessionStorage object does not persist after the window is closed and is not shared with other windows.

Source:

https://developer.apple.com/library/archive/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Name-ValueStorage/Name-ValueStorage.html

Chlorpromazine

Answer 6

'Data stored in sessionStorage gets cleared when the page session ends. A page session lasts for as long as the browser is open and survives over page reloads and restores. Closing a tab/window ends the session and clears objects in sessionStorage:'

// 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();

'There is nothing to commit in this chapter since all we had done was learning the basics of localStorage and sessionStorage.

'

Whittling

Answer 7

Data stored in sessionStorage gets cleared when the page session ends. A page session lasts for as long as the browser is open and survives over page reloads and restores. Closing a tab/window ends the session and clears objects in sessionStorage

Dortch

Answer 8

@KyleMit In iOS, their policies is to focus on iCloud which includes backup and so to save space. To do that from iOS 5, they clean some folder that they didn't clean before.

You can find in archive documentation that :

In iOS 5.0 and later, the system may delete the Caches directory on rare occasions when the system is very low on disk space. This will never occur while an app is running. However, be aware that restoring from backup is not necessarily the only condition under which the Caches directory can be erased.

They precise it again in other places in the actual doc like here :

In iOS, the on-disk cache may be purged when the system runs low on disk space, but only when your app is not running.

Legitimatize

Answer 9

sessionStorage will last until the browser is closed. One way to save sessionStorage data is to send it to a database.

Lapful

Answer 10

• The sessionStorage and localStorage properties allow saving key/value pairs in a web browser.
• The sessionStorage object stores data for only one session (the data is deleted when the browser tab is closed).
• Opening multiple tabs/windows with the same URL creates sessionStorage for each tab/window.
• Session storage is the same as local storage but the only difference is that data stored in session storage will clear automatically once the page session will expire.

For more Information to check this link w3schools sessionstorage

Carbazole