Basic Concepts:

All three are storage technologies for browsersCopy the code

Similarities and differences of the three:

Cookie: It is small, storing only 4KB of content. The main purpose is to save user login information, can independently set the expiration time, the default is to close the browser after the expiration, each request will be carried to the HTTP request header, although the cookie is small, but you store too much information will cause unnecessary performance problems

LocalStorage: new HTML5 API, the size is generally 5M, it only exists in the user’s current browser, will not communicate with the server, life cycle will be stored for a long time, unless the user manually destroyed, when the same page, will share the information in localStorage

SessionStorage: also 5M in size, existing in the current user’s browser, refresh page will not be destroyed, but will be destroyed after closing the page, life cycle only exists in the current page

Application:

Cookie: To determine whether to log in or not. When a user logs in, the server will add a unique identification code to the cookie to identify the user. The next request only needs to read this identity to determine whether the user is logged in. In the early days, cookies were also used for e-commerce sites to store the user’s shopping cart information to help reduce server pressure, but with the advent of localStorage, the use of cookies has become very small

LocalStorage: because localStorage supports long-term storage, when our website has too much form information, you can use localStorage to store the form data requested to the local, when the page is refreshed or the next request to be called, so as to reduce the server pressure

SessionStorage: temporary storage of current user information, destroyed when the web page is closed