Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

Note: Part of the article content and pictures from the network, if there is infringement please contact me (homepage public number: small siege lion learning front)

By: Little front-end siege lion, home page: little front-end siege lion home page, source: Nuggets

GitHub: P-J27, CSDN: PJ wants to be a front-end siege lion

Copyright belongs to the author. Commercial reprint please contact the author for authorization, non-commercial reprint please indicate the source.

Introduction of cookies

As mentioned earlier, HTTP is a stateless protocol. Each HTTP request is independent and irrelevant, and no state information is required by default. But sometimes you need to save some state. What do you do?

HTTP introduces cookies for this purpose. A Cookie is essentially a small text file stored in the browser, internally as key-value pairs (as you can see in the Application section of the Chrome developer panel). All requests sent to the same domain name carry the same Cookie, and the server gets the Cookie for parsing, then it can get the state of the client. The server can write cookies to the client through the set-cookie field in the response header. Examples are as follows:

// request header Cookie: a= XXX; // Response header set-cookie: a= XXX set-cookie: b= XXXCopy the code

Cookie attribute

Life cycle

Cookie expiration dates can be set using the Expires and max-age attributes.

  • ExpiresnamelyExpiration time
  • Max-age indicates the interval, in seconds, from the time when the browser receives the packet.

If the Cookie expires, the Cookie is deleted and not sent to the server.

scope

There are also two properties about scope: Domain and path, which bind the Domain name and path to the Cookie. If the Domain name or path does not match these two properties before sending the request, the Cookie will not be carried. It is worth noting that for paths, / means that cookies are allowed for any path under the domain name.

Safety related

If Secure is enabled, cookies can be transmitted only through HTTPS.

If the cookie field is marked with HttpOnly, it indicates that it can only be transmitted through HTTP and cannot be accessed through JS, which is also an important means to prevent XSS attacks.

Accordingly, there is the SameSite attribute for CSRF attack prevention.

SameSite can be set to three values, Strict, Lax, and None.

A. In Strict mode, the browser completely forbids third-party requests to carry cookies. For example, sanyuan.com can only carry cookies in the domain name of Sanyuan.com, but not in other websites.

B. In Lax mode, the Cookie can only be carried if the GET method submits a form condition or the A tag sends a GET request.

C. In None mode, which is the default mode, requests automatically carry cookies.

The disadvantage of the Cookie

  1. Capacity defects. Cookie size limit is only4KBCan only be used to store a small amount of information.
  2. Performance defects. Cookies follow the domain name, regardless of whether a certain address below the domain name needs the Cookie, the request will carry the complete Cookie, as the number of requests increases, in fact, will cause a huge performance waste, because the request carries a lot of unnecessary content. But you can get throughDomainandPathThe specifiedscopeTo solve it.
  3. Security defects. Since cookies are passed in plain text between the browser and the server, they can easily be intercepted by illegal users who then perform a series of tampering and resend them to the server within the Cookie’s validity period, which is quite dangerous. In addition, inHttpOnlyIf false, the Cookie information can be read directly from the JS script.

\

Thank you for reading, I hope to help you, if there is a mistake or infringement of the article, you can leave a message in the comment area or add a public number in my home page to contact me.

Writing is not easy, if you feel good, you can “like” + “comment” thanks for your support ❤