Detailed explanation of sessionStorage

sessionStorage can be set with setItem, obtained with getItem, deleted with removeItem, and cleared with clear. For details, see MDN

MDN explained

sessionStorage property allows you to access a session Storage object. It is similar to localStorage , the difference is that the data stored in localStorage has no expiration time setting, and the data stored in sessionStorage will be cleared when the page session ends. The page session persists as long as the browser is open, and reloading or resuming the page retains the original page session. **Opening a page in a new tab or window initiates a new session in the top-level browsing context,** which is different from how session cookies work.

It can be seen that the sessionStorage will be cleared when the page session ends, that is to say, the sessionStorage on a page will not be lost or cleared when the page is refreshed or the page is restored.

Will the sessionStorage data under that domain name be shared among multiple tabs on the same website? To solve this problem, use chrome to test the scene.

When there is sessionStorage on a page, add a tag and enter the same url as page a. The page opened in the new tab is when there is no sessionStorage in another tab page. That is, new tabs are new conversations.

_blank : When you click a link on page a or use window.open to open a tab page with the same url as page a, the sessionStorage of the new tab page inherits from the sessionStorage of the previous page, but the sessionStorage of the subsequent two pages is controlled separately. There is no connection between the two pages

in conclusion

1. Even if the url is the same between different tabs, sessionStorage will not be shared. sessionStorage only exists in the current session.
2. Use window.open or click the link to jump to the page, the sessionStorage of the new page will copy the old page. But there is no connection between the two, there are still two sessions.

refer to

https://ift.tt/PzMC36V

https://ift.tt/BGwUiZv

https://ift.tt/7yq0HKb

https://github.com/lmk123/blog/issues/66

https://ift.tt/p24J9hs

…

The post sessionStorage details first appeared on Lenix Blog .

This article is reprinted from https://blog.p2hp.com/archives/8919
This site is for inclusion only, and the copyright belongs to the original author.