The essentials of HTTP cookie attributes

[00:06] - When a web server responds. [00:08] to a request for a resource, the server can include a set cookie header along with its response. And that header tells your browser to store some text, a name and a value in a file known as a cookie. [00:22] For example, setCookie cat equals Tabby sets a cookie with the name cat and the value Tabby. [00:29] Now, in addition to providing a cookie name and value, the SetCookieHeader can include attributes to control when and how cookies are set and when cookies expire. [00:42] Cookie attributes included in the setCookie header are separated by semicolons. [00:48] And here's an example that sets the expiry date of the cookie. [00:53] Now, note that browsers may set their own limits on the maximum expiration date of a cookie. [01:00] So this video explains the most important features of cookie attributes. And the article with this video explains cookie attributes in more technical detail. [01:12] And if you're not sure how cookies work, well, [01:14] Take a look at our video, what are cookies and the guide that goes with it. [01:19] So first up, [01:21] Domain. If a setCookieHeader has a domain attribute, the cookie is sent with requests to the specified domain along with any of its subdomains. [01:33] Now, if the setCookieHeader doesn't have a domain attribute, the cookie is not sent with responses for subdomain requests. In other words, when you include the domain attribute, it reduces domain restrictions.

[01:50] So for example, take a look at the response from the cats.example website. [01:56] If no domain attribute is set, the cookie is included with requests to cats.example and not any subdomains. [02:05] However, if the domain is set as cats.example, the cookie is included with requests to cats.example, as well as any requests for resources on subdomains, such as fluffy.cats.example or user.assets.cats.example. [02:24] And by the way, a cookie with the domain that does not match the server that set it is rejected by the browser. [02:33] And one thing to bear in mind here, after a cookie is set, it's only sent to the site that set it. You know, for example, a cookie set by cats.example won't be sent in requests to a different site such as dogs.example. [02:49] Next up, the path attribute. Well, [02:52] Like domain, this attribute controls what URLs a cookie is sent to. [02:57] And if no path attribute is included in a set cookie response header, the cookie that's set will only be included in requests to the same directory. For example, you visit the cats.example website and your browser makes a request for an image in the site's images directory. cats.example slash images slash tabby.jpg.

[03:27] not include a path value. [03:30] And not having a path means that the cookie is only included with requests to the resources in the same directory. [03:39] In our example, a request for tabi.jpg in the images directory includes the cookie, but not a request for a resource in the articles directory. [03:52] If a set cookie response header does include a path attribute, the cookie that's set is included in requests to any URL path that matches the path value. So if the path is set to slash articles, then a request to any URL path that begins with slash articles includes the cookie. [04:22] index.html will include the cookie. And so will a request to cats.example.articles.breeds.tavi.index.html. [04:35] However, the cookie will not be included in requests to the images directory or for any request to a URL that doesn't begin with the path slash articles. [04:49] If the path is set to a forward slash on its own, so path equals forward slash, [04:57] Then the cookie is sent along with requests for any URL on the site.

[05:03] Next up, expires and max age. Well, you can specify a cookie expires date and time, or a cookie max age in seconds, after which the cookie is deleted and no longer sent. For example, set cookie cat equals tabby expires equal to 31 des 2 999 23 59 59 GMT. Well, this cookie expires at the end of the millennium. [05:33] And by the way, note that browsers may cap the maximum expiration. [05:39] Now, another way to control the cookie lifetime is through max age. And this attribute is used when you want the cookie to last a certain duration, but you don't want to base that expiration on a date. [05:52] Now, setcookiecat equals tabby, max age equals 86400. [05:58] Well, this cookie expires after 86,400 seconds, which is equivalent to one day. [06:06] And if you don't specify a max age or expires attribute, a cookie is deleted when the current website session ends. And this type of cookie is sometimes known as a session cookie. [06:22] *sigh* [06:23] If a set cookie header includes the HTTP only attribute, [06:28] The cookie cannot be accessed from JavaScript code using the document.cookie method. The cookie can only be accessed by the server that set it. And this helps protect against certain types of attacks that use JavaScript to target cookies.

[06:46] Next up, the secure attribute. If a set cookie header includes secure, the cookie is only included with requests that use the encrypted HTTPS protocol. The cookie will not be included in unencrypted HTTP requests. [07:16] it. [07:17] And if you're a web developer, you should set server cookies as HTTP only secure whenever possible. [07:25] Next attribute, same site. Well, this is a little more complex to explain. So say you're visiting the website cats.example again. Well, this site includes a map from a different origin. [07:39] catmap.example [07:41] And remember that a request for a resource from a site that's different from the site that you're visiting is a cross site request. [07:49] A cookie set in response to a cross-site request is known as a third-party cookie, and the same site attribute controls whether a third-party cookie is included in a request. [08:02] And Same Site can be one of three possible values: strict, [08:08] lacks [08:09] or none. [08:11] Now with strict, the cookie is sent in response to requests from a page that's on the cookies origin site. For example, you visit cats.example and have a cookie set with the attribute same site equals strict.

[08:26] Now, later on, you're on a different site and you follow a link to a page on the cats.example site. [08:33] Now that request is cross-site, so [08:36] The same site equals strict cookie that was set previously will not be sent with the request for the cats.example page. [08:46] Lacks works the same way as strict, except that the browser also includes the cookie when the user follows a link to the cookie's origin site. [08:57] Now, unlike the previous strict example, the cookie is included when you follow a link to the cats.example site. [09:05] and lax is the default setting if no same-site attribute is included in the set cookie header. [09:12] With same site equals none, well, there are no constraints. A cookie is included with a request whether or not it's cross site. Though, of course, the cookie is still only sent to the site that set it. [09:27] With sameSite equals none, the cookie must also have the secure attribute. [09:33] Now, since third-party cookies must be same site equals none, you can actually check for that value when you're auditing for third-party cookie dependencies. [09:45] And finally, the partitioned attribute. And I have to say, this is my favorite cookie attribute because it's relatively simple to use. That can make a big difference. [09:55] This attribute lets you opt in a cookie to partitioned storage with a separate cookie jar per top-level site.

[10:05] And the cookie is double keyed by the top level site as well as the domain that sets it. [10:11] For example, imagine that there are two websites, website A and website B, but both include an iframe from website C. [10:21] A partitioned cookie set by the iframe on website A cannot be accessed by the iframe on website B. [10:30] The AC cookie is separate from the BC cookie. [10:35] Yeah. [10:36] Cookies with a partitioned attribute are known as chips. Cookies having independent partitioned state. [10:44] and partitioned cookies must have the secure attribute. [10:49] Now, partitioning cookies helps prevent data leakage and can enable a site to read and write cookies in cross-site contexts, such as iframes, where third-party cookies are blocked. [11:01] And the good news is that since chips are partitioned by a top-level site, they can't be used for cross-site tracking. But that also means that they're not blocked by third-party cookie restrictions. So you should definitely consider partitioning cookies wherever you can. [11:20] Well, that covers the basics of cookie attributes. Thanks so much for watching. Be sure to check out all the videos in the cookie basics series. And if you're not sure how cookies work, check out our video. What are cookies? We have a guide and demos to go with this video and lots more resources on our website to help you understand cookies.

[11:44] Thank you.