HTML study notes (seven) Web Storage

Web Storage allows users to save data in a browser, specifically divided into two types, one is localStorage, one is sessionStorage

For storage of the client, there are similar and even early cookie is still widely used, the difference between them is as follows:

	cookie	localStorage	sessionStorage
Communication with the server	Each request will carry	Does not communicate with the server	Does not communicate with the server
Data life cycle	Before the expiration time set effective	Permanent, unless the initiative to remove	In effect until the browser is closed
Scope data	Set the domain name and its subdomains	Homology shared between all windows	Can not be shared between different windows
The stored data size	Usually no more than 4KB	Generally about 5MB	Generally about 5MB

Web Storage API inherited windowobjects, and provides two new properties, window.localStorageandwindow.sessionStorage

Common properties and methods as follows:

• length: Save the number of stripes
• setItem(key, value):save data
• getItem(key): Gets the specified data
• removeItem(ket): Delete the specified data
• clear(): Delete all data
• key(index): Get the index keys

if (window.localStorage) {
    var storage = window.localStorage
    storage.setItem('username', 'admin')
    storage.setItem('password', '12345')
    let username = storage.getItem('username')
    let password = storage.getItem('password')
    console.log(username) // admin
    console.log(password) // 12345
    console.log(storage.length) // 2
    storage.removeItem('password')
    console.log(storage.length) // 1
    storage.clear()
}

The last way to add knowledge of cookie and session

We know, HTTP protocol is stateless, which means that each request is issued is independent, this time it will cause a lot of inconvenience

For example, after a user logs in one request, for he sent another request, the server still does not recognize the identity of the user

The session cookie and the emergence of information is to record the user's identity so many times to identify the user's request

The operating mechanism of the cookie as follows:

• Server in the response by set-cookiethe head requires a browser cookie settings
• The browser after receiving the response, if the browser supports the use of cookie, then the cookie will be saved to a file
• Each subsequent browser request will request by cookietape head cookie information
• After the server receives the request, according to identify the user cookie information

The operating mechanism of session are as follows:

• The server creates a unique identity, and this identity preserved and the corresponding session information, and then sent to the browser identity

  Common save session information in three ways, one is stored in memory, one is saved in a file, one is saved in the database

• Upon receipt of this browser identification, at each subsequent request, the identifier will bring

  Identify ways to bring common are two, one is attached to a cookie, one is attached to the URL parameter

• Server receives the request, according to identification information for identifying the user session to find the corresponding identity

data stored in the cookie on the browser, session data stored on the server, so the relatively safer use of session

However, too much session data stored on the server, can affect the performance of the server, it is necessary to weigh the choice

[Read More HTML series of articles, look at HTML study notes ]