The first thing to know is to use the browser's developer tools, press F12 after the browser is running
The browser's caching mechanism provides a way to store user data on the client, and can use cookies, sessions, etc. to interact with the server.
1. Cookies and sessions
Both cookies and sessions are used to track the user's identity as a browser session.
distinguish:
1. Maintain the state: the cookie is saved on the browser side, and the session is saved on the server side
2. Application scenarios:
Cookies: (1) Determine whether the user has logged into the website so that the next login can be automatically logged in (or remember the password). If we delete cookies, we must re-fill in the login-related information each time we log in.
(2) Save information such as the time of the last login.
(3) Save the last page you viewed
(4) Browse count
Session: Session is used to save each user's private information, and the value of the variable is saved on the server side, distinguishing different customers by sessionID.
(1) Shopping cart in the online mall
(2) Save the user login information
(3) Put some data into sessions for use on different pages of the same user
(4) Prevent users from logging in illegally
Local storage of HTML5
Explanation one
There are two important things related to local storage in HTML5: Web Storage and local databases. Among them, the Web Storage storage mechanism is an improvement over the cookie storage mechanism in HTML4. Due to the many drawbacks of the cookie storage mechanism, HTML5 no longer uses it, but instead uses an improved Web Storage storage mechanism. Local database is a new feature in HTML5, using it to create a database locally on the client side, the content that must be saved in the server-side database can now be saved directly on the client side, which greatly reduces the burden on the server side, but also speeds up the access to data.
This article focuses on Web Storage
We know that in HTML4 it is possible to use cookies to save simple user information such as usernames on the client side, however, through long-term use, you will find that storing permanent data with cookies has the following problems:
1. Size: The size of the cookie is limited to 4KB.
2. Bandwidth: Cookies are sent along with HTTP transactions, so a portion of the bandwidth used when sending cookies is wasted.
3. Complexity: It is difficult to manipulate cookies correctly.
In response to these problems, in HTML5, a function of saving data locally on the client is re-provided, which is Web Storage.
Specifically, Web Storage is divided into two types:
1.sessionStorage: Save data in a session object. The so-called session refers to the time that the user spends browsing a website from entering the website to the browser closing, that is, the time spent by the user browsing the website. The session object can be used to hold any data that is required to be saved during this time.
2.localStorage: Saves data in the client's local hardware device (usually referring to the hard disk, but also another hardware device), even if the browser is closed, the data is still there, and can continue to be used the next time the browser is opened to visit the website.
The difference between the two is that sessionStorage is temporarily saved, while localStorage is permanently saved.
So far, browsers above Firefox3.6, Chrome6 or above, Safari 5 or more, Pera10.50 or above, and IE8 and above support the use of sessionStorage and localStorage.