Cookies: simple and comprehensive guide

Cookies are small pieces of text data stored in the browser mainly used for authentication, tracking and personalization.

Limits

Typically, the following are allowed:
300 cookies in total
4096 bytes per cookie
20 cookies per domain
81920 bytes per domain
** Given 20 cookies of max size 4096 = 81920 bytes.

How to create a cookie?

• Javascript:

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";

• HTTP response:

Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>; Secure; HttpOnly

How to read a cookie?

• Javascript: Note that javascript will not have access to httponly cookies.

let x = document.cookie; // returns cookie1=value; cookie2=value;

• HTTP request: your browser will send the cookies to the associated site in eligible requests in the http headers, so it's easy read them from service side.

How to delete a cookie?

just set the same cookie with passing "expires" as a past date.

Attributes:

• Secure: The cookie will be sent only over https.
• HttpOnly: Can't be accessed from client side.
• Domain: the cookie will be sent if the domain matches or if it is a subdomain, then the path attribute will be checked next.
• Path: if the path attribute was set to the web server root /, then the application cookies will be sent to every application within the same domain If set to specific path like "/blog", then it will be sent only to the requests that matches the path like "/blog/hello".
• Expires: To specify when the cookie will die, this time is relative to the client not the server.
• Max-Age: After how many seconds the cookie will expire, not supported by all browsers.
• SameSite: To control sending cookies along with cross-site requests and take three values:
  • Strict: Sent only to first-party.
  • Lax: Default in most browsers, same as Strict except that cookies are sent when the user navigates to the cookie's origin site.
  • None: Sent cross-site.

Prefixes:

• __Host- : the cookie will be rejected if not Secure with no Domain and Path = "/".
• __Secure- : will be rejected if not Secure.

Types:

1. First-party Cookies:
   Set by the website visited by the user through HTTP headers.

2. Third-party Cookies:
   Set by other domains, examples: ads, iframes, fonts, images from other domains.
   Starting in chrome v80 cookies are restricted to first party, default value for samesite attribute if not set is Lax,
   If you need 3rd party you need to explicitly mark it as samesite=none and sercure=true.

3. Persistent Cookies:
   Deleted at a date specified by the Expires attribute, or after a period of time specified by the Max-Age attribute.

4. Non-persistent Cookies:
   If expires attribute is empty, it will be deleted when you close your browser.

5. Zombie Cookies:
   Extremely persistent cookies in a browser. Its goal is to identify a client even after they've removed standard cookies.

6. Flash Cookies:
   No longer exists, local shared object used by Adobe Flash.

Legal:

All regulations require:

• Notify user that you are using cookies.
• Allowing users to opt out of receiving some or all cookies.
• Allowing users to use the bulk of your service without receiving cookies.

Further reads:

https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies
https://github.com/samyk/evercookie