H5 local storage-sessionStorage, localStorage,
HTML5 provides two new methods to store data on the client:
- LocalStorage-data storage with no time limit
- SessionStorage-data storage for a session
SessionStorage, LocalStorage, and Cookie can be used to store data on the browser. Both localStorage and sessionStorage are locally stored.
The Cookie will be appendedCookie
Header field, which is used by the server to know the user's status.
The concept of Web Storage is similar to that of cookie. The difference is that it is designed for larger Storage capacity. The Cookie size is limited, and the Cookie will be sent every time you request a new page. This will result in a waste of bandwidth. In addition, the cookie also needs to specify the scope, cross-origin calls are not allowed.
SessionStorage is session-type, that is, if you close the browser, its data will be deleted.
LocalStorage is persistent and does not expire unless you delete it manually.
Manually reference the link to the http://harttle.com/2015/08/16/localstorage-sessionstorage-cookie.html
The reference content is as follows:
The storage provided by LocalStorage/SessionStorage is also a string-based Key-value pair. You can usesetItem
,getItem
To access the storage items:
localStorage.clear();localStorage.setItem('key', 'value');localStorage.getItem('key'); // => 'value'localStorage.removeItem('key');
Because it can only store strings, JSON can only be serialized as strings:
var testObject = { 'one': 1, 'two': 2, 'three': 3 };// Put the object into storagelocalStorage.setItem('testObject', JSON.stringify(testObject));// Retrieve the object from storagevar retrievedObject = localStorage.getItem('testObject');console.log('retrievedObject: ', JSON.parse(retrievedObject));