Cookies de SameSite explicadas

Navegadores compatibles

  • 51
  • 16
  • 60
  • 13

Origen

Cada cookie contiene un par clave-valor junto con varios atributos que controlan cuándo y dónde se usa esa cookie.

La introducción del atributo SameSite (definido en RFC6265bis) te permite declarar si tu cookie está restringida a un contexto propio o del mismo sitio. Es útil entender exactamente qué significa "sitio" en este caso. El sitio es la combinación del sufijo de dominio y la parte del dominio justo antes de él. Por ejemplo, el dominio www.web.dev forma parte del sitio web.dev.

Término clave: Si el usuario está en www.web.dev y solicita una imagen a static.web.dev, es una solicitud del mismo sitio.

La lista de sufijos públicos define qué páginas se consideran en el mismo sitio. No solo depende de dominios de nivel superior, como .com, sino que también puede incluir servicios como github.io. Esto permite que your-project.github.io y my-project.github.io cuenten como sitios independientes.

Término clave: Si el usuario está en your-project.github.io y solicita una imagen a my-project.github.io, eso es una solicitud entre sitios.

Usa el atributo SameSite para declarar el uso de cookies

El atributo SameSite de una cookie proporciona tres formas diferentes de controlar este comportamiento. Puedes elegir no especificar el atributo o usar Strict o Lax para limitar la cookie a solicitudes del mismo sitio.

Si configuras SameSite como Strict, solo se puede enviar la cookie en un contexto propio, es decir, si el sitio de la cookie coincide con el sitio que se muestra en la barra de direcciones del navegador. Por lo tanto, si la cookie promo_shown se configura de la siguiente manera:

Set-Cookie: promo_shown=1; SameSite=Strict

Cuando el usuario está en tu sitio, la cookie se envía con la solicitud como se esperaba. Sin embargo, si el usuario sigue un vínculo a tu sitio desde otro, la cookie no se envía en esa solicitud inicial. Esto es útil para cookies relacionadas con funciones que siempre se encuentran tras una navegación inicial, como el cambio de una contraseña o la realización de una compra, pero es demasiado restrictiva para una cookie como promo_shown. Si el lector sigue el vínculo al sitio, quiere que se envíe la cookie para que se pueda aplicar su preferencia.

SameSite=Lax permite que el navegador envíe la cookie con estas navegaciones de nivel superior. Por ejemplo, si otro sitio hace referencia al contenido de tu sitio, en este caso, usa la foto de tu gato y proporciona un vínculo a tu artículo de la siguiente manera:

<p>Look at this amazing cat!</p>
<img src="https://blog.example/blog/img/amazing-cat.png" />
<p>Read the <a href="https://blog.example/blog/cat.html">article</a>.</p>

Con una cookie configurada como Lax de la siguiente manera:

Set-Cookie: promo_shown=1; SameSite=Lax

Cuando el navegador solicita amazing-cat.png para el blog de la otra persona, tu sitio no envía la cookie. Sin embargo, cuando el lector sigue el vínculo a cat.html en tu sitio, esa solicitud sí incluye la cookie.

Te recomendamos que uses SameSite de esta manera, que establezcas en Lax las cookies que afectan la visualización del sitio web y las cookies relacionadas con las acciones del usuario en Strict.

También puedes establecer SameSite en None para indicar que deseas que la cookie se envíe en todos los contextos. Si proporcionas un servicio que consumen otros sitios, como widgets, contenido incorporado, programas de afiliados, publicidad o acceso en varios sitios, usa None para asegurarte de que tu intención sea clara.

Tres cookies etiquetadas como &quot;Ninguna&quot;, &quot;Laxa&quot; o &quot;Estricta&quot; según su contexto
Marca explícitamente el contexto de una cookie como None, Lax o Strict.

Cambios en el comportamiento predeterminado sin SameSite

Navegadores compatibles

  • 80
  • 86
  • x

El atributo SameSite es ampliamente compatible, pero no se adoptó ampliamente. Antes, cuando se configuraban cookies sin SameSite, de forma predeterminada, se enviaban en todos los contextos, lo que dejaba a los usuarios vulnerables a los CSRF y a la filtración de información involuntaria. Para alentar a los desarrolladores a que expongan su intención y brindarles a los usuarios una experiencia más segura, la propuesta de IETF llamada Cookies incrementales de forma incremental establece dos cambios clave:

  • Las cookies que no tienen un atributo SameSite se consideran SameSite=Lax.
  • Las cookies con SameSite=None también deben especificar Secure, lo que significa que requieren un contexto seguro.

Ambos cambios son retrocompatibles con navegadores que implementaron correctamente la versión anterior del atributo SameSite, además de navegadores que no admiten versiones anteriores de SameSite. Su objetivo es reducir la dependencia de los desarrolladores del comportamiento predeterminado de los navegadores haciendo explícitos el comportamiento de las cookies y el uso previsto. Los clientes que no reconozcan SameSite=None deben ignorarlo.

SameSite=Lax de forma predeterminada

Si envías una cookie sin especificar su atributo SameSite, el navegador la trata como si estuviera configurada en SameSite=Lax. De todas formas, recomendamos configurar SameSite=Lax de forma explícita para que la experiencia del usuario sea más coherente en todos los navegadores.

SameSite=None debe ser seguro

Cuando creas cookies entre sitios con SameSite=None, también debes configurarlas en Secure para que el navegador las acepte:

Set-Cookie: widget_session=abc123; SameSite=None; Secure

Puedes probar este comportamiento a partir de Chrome 76 habilitando about://flags/#cookies-without-same-site-must-be-secure; desde Firefox 69, configura network.cookie.sameSite.noneRequiresSecure en about:config.

También recomendamos actualizar las cookies existentes a Secure lo antes posible. Si dependes de servicios que proporcionan contenido de terceros en tu sitio, asegúrate de que el proveedor de servicios actualice sus cookies y actualiza los fragmentos o las dependencias de tu sitio para garantizar que use el comportamiento nuevo.

Si quieres obtener más detalles sobre cómo actualizar tus cookies para controlar correctamente estos cambios en SameSite=None y las diferencias en el comportamiento del navegador, consulta el siguiente artículo, Recetas de cookies de SameSite.

Gracias por las contribuciones y los comentarios de Lily Chen, Malte Ubl, Mike West, Rob Dodson, Tom Steiner y Vivek Sekhar.

Cookie hero image de Pille-Riin Priske en Unsplash