A, JS of the three data storage
cookie、sessionStorage、localStorage
Two, cookie
cookie definition:
A cookie is a small data stored on the browser used to record certain information when the page is turned off or refresh still need to be recorded. In the console with document.cookiecan view the cookie currently browsing the site.
cookie problems:
Although the cookie is convenient, but using cookie has a big downside, all the data in the cookie can be modified on the client, the data is very easy to be falsified, some important data can not be placed in a cookie, and if the cookie in too many data fields can affect the transmission efficiency
三、sessionStorage
When users log in to a website with account and password, refresh the page remains the state logged in, the user how to distinguish the server initiated the request is just to log off users? Here it is to use session state of preservation.
Enter the user submits the username and password to the server, the server will verify information on creating a recording session for the user after the adoption of this session can be stored in server memory can also be saved in the database.
- After you create a session, session_id will be added to the respective associated head through http setCookie
- Have found that the browser set-cookie response header field when the page loads, put this kind of cookie to the browser at the specified domain name
- When the next refresh the page, the request will bring this Cookie, server after receiving the user identified based on this session_id.
四、localStorage
-
localStorage API H5 is one of the characteristics of local storage web storage for large amounts of data (maximum 5M) stored in the browser, save the data will not fail forever expire, unless cleared by js manually.
-
Does not participate in the network transmission
-
Generally used for performance optimization, you can save the image, js, css, html templates, large amounts of data
The difference between five, cookie, sessionStorage, localStorage
The same point: are stored on the client
difference:
1, the storage size
General browser cookie maximum storage capacity of 4k, although sessionStorage and localStorage also limited storage size, but much larger than the cookie.
2、存储有效期：
cookie stored data is valid until the expiration time, even if you close your browser
sessionStorage; Saved data for a browser session (session), when the session ends (usually a window closed), the data is cleared localStoragewhen saving data exist for a long, because localStorage data is written to disk, each read data , in fact, these bytes are read from the hard disk drive.
3, interaction
the cookie data is automatically transmitted to the server, the server can also write cookie to client
sessionStorage and localStorage not automatically send data to the server, save only in the local
Reference link: https: //www.jianshu.com/p/775b64b3d35f