Cross-Site Cookies

This guide covers the details regarding Cross-Site cookies related to the Domain and SameSite Attributes.

Cross-site cookies can be convenient and complex for developers, especially regarding authentication. These cookies enable seamless user sessions across different domains. Understanding the domain and SameSite attributes is vital to building robust and secure authentication systems. Let's explore their usage and demystify their complexities.

Domain Attribute

The domain attribute defines the scope of a cookie, determining which domains and subdomains can access it. Below you will find a few examples using Express.js.

Example 1: Specific Domain

In this example, when a user visits the /set-cookie route, a cookie named user with the value Joe Person is set with the domain attribute set to www.example.com. This cookie will only be accessible on the www.example.com domain and its subdomains.

app.js

app.get('/set-cookie', (req, res) => {
  res.cookie('user', 'Joe Person', { domain: 'www.example.com' });
  res.send('Cookie set!');
});

Example 2: All Subdomains

In this example, the domain attribute configured is .example.com with a preceding dot. This configuration allows the cookie to be accessible on all subdomains of example.com, such as subdomain.example.com or another.subdomain.example.com.

Note

Only the current configured domain can be the value or a domain of a higher order unless it is a public suffix, which is never allowed. Setting the domain will make the cookie available to it, as well as to all its subdomains. If omitted, this attribute defaults to the host of the current document URL, not including subdomains. e.g., if the response is sent from api.descope.com the only acceptable domain values are api.descope.com and descope.com

app.js

app.get('/set-cookie', (req, res) => {
  res.cookie('user', 'Joe Person', { domain: '.example.com' });
  res.send('Cookie set!');
});

Same-Site Attribute

The SameSite attribute controls how cookies behave in different contexts. Below you will find a few examples using Express.js.

Example 1: Strict

In this example, the SameSite attribute configuration is Strict. This configuration ensures that the cookie will only be sent with requests originating from the same site, providing higher security. Strict configuration means that if the user is visiting example.com and a request is made to api.descope.com, the cookies will not be sent with that request.

app.js

app.get('/set-cookie', (req, res) => {
  res.cookie('user', 'Joe Person', { sameSite: 'Strict', domain: 'api.descope.com' });
  res.send('Cookie set!');
});

Example 2: Lax

In this example, the SameSite attribute configuration is Lax. The cookie will be sent with top-level navigation requests and some cross-site requests initiated by the user but not with requests initiated by third-party resources.

app.js

app.get('/set-cookie', (req, res) => {
  res.cookie('user', 'Joe Person', { sameSite: 'Lax' });
  res.send('Cookie set!');
});

Example 3: None

In this example, the SameSite attribute is configured as None to allow cross-site access. However, it also requires configuration of the Secure attribute, ensuring the cookie is sent only over HTTPS connections.

app.js

app.get('/set-cookie', (req, res) => {
  res.cookie('user', 'Joe Person', { sameSite: 'None', secure: true });
  res.send('Cookie set!');
});

Conclusion

By correctly utilizing the domain and SameSite attributes, developers can control cookie accessibility, enhance security, and provide a seamless authentication experience across different domains and subdomains.

Was this helpful?

On this page