with the rapid development of the Internet, Web-based applications are becoming more and more common, but also become more and more complex, in order to meet a variety of needs, will often store a large number of local data, the traditional way we document.cookie to store, But because of its storage size is only about 4k, and the resolution is quite complex, every time the request will carry a cookie, will cause the waste of bandwidth, to the development of a lot of inconvenience,HTML5 specification proposed solution. Web storage means storing data on a user's computer, which relieves stress on the server and improves the experience 1 features 1. Easy to set up and read 2 , large capacity, sessionstorage about 5m, Localstorage about 20m 3, only the string can be stored, the object may be json.stringify () encoded after storage 2 Window.sessionstorage1, the life cycle is closed the current page window 2, can not be more than the window to share data (homologous strategy, Baidu home of the local Ali their home is not get) add: By jumping you canApplication Scenarios:1, the page jump can be achieved through the session data sharing 2, in some single page (spa) in the use of the page to pass the value of the time is more useful 3 Window.localstorage1, permanent effect, unless manually deleted or deleted with code 2, can be multi-window sharing (same- origin policy) Application Scenario: Some data that is not related to security (not too large) can be stored locally4 Detailed methods SetItem (key, value) to set the storage content Window.localstorage/sessionstorage.setitem (key,value);GetItem (key) Read storage content Window.localstorage/sessionstorage.getitem (key,value);RemoveItem (key) Delete stored content with key value Window.localstorage/sessionstorage.removeitem (key,value);Clear () empties all stored content window.localstorage/sessionstorage.empty ();Key (n) takes the index value to get the key name Window.localstorage/sessionstorage.key (n); Number of data stored in lengthwindow.localstorage/sessionstorage.length;difference:cookie Data : always in the same Origin< Span style= "FONT-SIZE:16PX; Color: #3f88bf; Text-decoration:underline ">http request cookie is passed back and forth between the browser and the server. Sessionstorage and Localstorage do not automatically send data to the server and are saved locally only. The cookie data also has the concept of path, which limits the cookie to only one path. The storage size limit is also different, the cookie data cannot exceed 4k, and because each time HTTP request Will carry cookie, so the cookie is only suitable for storing very small data, such as session ID. Sessionstorage and Localstorage have a storage size limit, but are much larger than cookies and can reach 5M or larger. Data validity period is different; sessionstorage: is only valid until the current browser window is closed, it is not possible to persist;localstorage: always valid, the window or browser Close is also saved, so it is used as persistent data, and the cookie is only valid until the cookie expiration time is set, even if the window or browser is closed. Different scopes, Sessionstoragecannot be shared in different browser windows, even on the same page;Localstorage is shared across all homologous windows, and cookies are shared across all homologous windows. The same point: Store data, store it on the Web side, and are all homologous different points:(1) cookies are only 4 K small and each request will bring a cookie. Bad experience, wasting bandwidth (2) session and local are stored directly locally, the request will not be carried, and the capacity is much larger than the cookie (3) session is a temporary conversation, when the window is closed when it is cleared, and local permanent existence, Cookie has expiration time (4) cookies and local can support multi-window sharing, but the session does not support multi-window sharing but supports a new window for link jump
Web Local Storage
