“This is the 10th day of my participation in the Gwen Challenge in November. Check out the details: The Last Gwen Challenge in 2021.”

I’m Cookie!

  • Cookies are data (usually encrypted) stored on a user’s local terminal to record information that needs to be recorded after a page is closed or refreshed. Use “document.cookie” on the console to view cookies for the site you are currently viewing.

  • Cookies can be directly set in the browser using JS (used to record insensitive information, such as user name), or set cookies specified by HTTP protocol can be used on the server to allow the browser to plant cookies. (For a more common case, such as clearing all cookies and then refreshing the page, try looking for set-cookie in Response Headers of a network)

  • The maximum storage capacity of cookies is 4K, so do not store a lot of data in cookies.

  • A cookie is attached to the Request Headers for every network Request. Therefore, if too many cookies are too large, the transmission efficiency will be affected.

  • Cookie The cookie set remains valid until the expiration time, even if the window or browser is closed.

  • Scope: Is shared across all origin Windows

  • Application scenario: It is used to determine whether a user has logged in to the website so that the user can automatically log in to the website next time or remember the password. Save event Information

Do you know browser local storage?

In older browsers, JS provides sessionStorage and globalStorage. LocalStorage is provided in HTML5 to replace globalStorage.

Therefore, Web Storage in HTML includes two Storage methods: sessionStorage and localStorage.

I am a localstorage

  • LocalStorage is used for persistent localStorage, the life cycle is permanent, even if the browser is closed, data will not disappear, unless actively deleted.

  • Storage capacity: the size of a piece of data to be stored does not exceed 5M.

  • Scope: localStorage is shared in all origin Windows.

  • Communication: only in the client (browser) save, do not participate in the communication server.

  • Application scenario: Used for long-term login. Data stored locally for a long time

I am the sessionstorage

  • Sessionstroage is the session storage. The life cycle is browser-dependent. When the browser page or page is closed, the data disappears. It stores no more than 5M of data, and there is no limit on the number of data.

  • Scope: Is shared within the same browser window (different browsers, even unified pages are not shared).

  • Communication: only in the client (browser) save, do not participate in the communication server.

  • Application scenario: A sensitive account is used to log in to a page at a time