Web storage, sometimes known as DOM storage (Document Object Model storage), provides web apps with methods and protocols for storing client-side data. Web storage supports persistent data storage, similar to cookies but with a greatly enhanced capacity[1] and no information stored in the HTTP request header.[2] There are two main web storage types: local storage and session storage, behaving similarly to persistent cookies and session cookies respectively. Web Storage is standardized by the World Wide Web Consortium (W3C)[3] and WHATWG.[4] All major browsers support it.
Web storage differs from cookies in some key ways.
Browsers that support web storage have the global objects sessionStorage
and localStorage
declared at the window level. The following JavaScript code can be used on these browsers to trigger web storage behavior:
// Store value on browser for duration of the session
sessionStorage.setItem('key', 'value');
// Retrieve value (gets deleted when browser is closed and re-opened) ...
alert(sessionStorage.getItem('key'));
// Store value on the browser beyond the duration of the session
localStorage.setItem('key', 'value');
// Retrieve value (persists even after closing and re-opening the browser)
alert(localStorage.getItem('key'));
Only strings can be stored via the Storage API.[11] Attempting to store a different data type will result in an automatic conversion into a string in most browsers. Conversion into JSON, however, allows for effective storage of JavaScript objects.
// Store an object instead of a string
localStorage.setItem('key', {name: 'value'});
alert(typeof localStorage.getItem('key')); // string
// Store an integer instead of a string
localStorage.setItem('key', 1);
alert(typeof localStorage.getItem('key')); // string
// Store an object using JSON
localStorage.setItem('key', JSON.stringify({name: 'value'}));
alert(JSON.parse(localStorage.getItem('key')).name); // value
The W3C draft is titled "Web Storage". "DOM storage" has also been a commonly used name, though it is becoming less so; for example the "DOM Storage" web articles of the Mozilla and Microsoft developer sites have been replaced with "Web Storage" articles.[12][13][14][15]
The "DOM" in DOM storage does not literally refer to the Document Object Model. According to the W3C, "The term DOM is used to refer to the API set made available to scripts in Web applications, and does not necessarily imply the existence of an actual Document object..."[16]
Storage of web storage objects is enabled by default in current versions of all supporting web browsers, with browser vendors providing ways for users to natively enable or disable web storage, or clear the web storage "cache". Similar controls over web storage are also available through 3rd party browser extensions. Each browser stores Web storage objects differently:
webappsstore.sqlite
in the user's profile folder.\AppData\Local\Google\Chrome\User Data\Default\Local Storage
" on Windows, and "~/Library/Application Support/Google/Chrome/Default/Local Storage
" on macOS.\AppData\Roaming\Opera\Opera\sessions\autosave.win
" or "\AppData\Local\Opera\Opera\pstorage\
" depending upon Opera's version.\AppData\LocalLow\Microsoft\Internet Explorer\DOMStorage
".
By: Wikipedia.org
Edited: 2021-06-18 12:38:10
Source: Wikipedia.org