Cada cookie contiene un par clave-valor junto con una serie de atributos que controlan cuándo y dónde se usa.
La introducción del atributo SameSite
(definido en la RFC6265bis) te permite declarar si tu cookie está restringida a un contexto propio o del mismo sitio. Es útil comprender exactamente qué significa "sitio" aquí.
El sitio es la combinación del sufijo de dominio y la parte del dominio que está justo antes de él. Por ejemplo, el dominio www.web.dev
es parte del sitio web.dev
.
Término clave: Si el usuario está en www.web.dev
y solicita una imagen de static.web.dev
, esa es una solicitud del mismo sitio.
La lista de sufijos públicos define qué páginas se consideran que están 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
se registren como sitios independientes.
Término clave: Si el usuario está en your-project.github.io
y solicita una imagen de my-project.github.io
, esa 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 optar por no especificar el atributo o usar Strict
o Lax
para limitar la cookie a solicitudes del mismo sitio.
Si configuras SameSite
como Strict
, tu cookie solo se puede enviar en un contexto propio, es decir, si el sitio de la cookie coincide con el que se muestra en la barra de direcciones del navegador. Por lo tanto, si la cookie promo_shown
se establece 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 espera.
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 bueno para las cookies relacionadas con funciones que siempre están detrás de una navegación inicial, como cambiar una contraseña o realizar una compra, pero es demasiado restrictivo 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, con 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 establecida en 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.
Recomendamos usar SameSite
de esta manera, configurando las cookies que afectan la visualización del sitio web en Lax
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 intent sea claro.
Cambios en el comportamiento predeterminado sin SameSite
Navegadores compatibles
El atributo SameSite
es ampliamente compatible, pero no se adoptó de forma generalizada.
En el pasado, configurar cookies sin SameSite
establecía de forma predeterminada que se enviaran en todos los contextos, lo que dejaba a los usuarios vulnerables a CSRF y a filtraciones de información no intencionales. Para alentar a los desarrolladores a indicar su intención y brindar a los usuarios una experiencia más segura, la propuesta de IETF, Cookies incrementalmente mejores, establece dos cambios clave:
- Las cookies que no tienen un atributo
SameSite
se consideranSameSite=Lax
. - Las cookies con
SameSite=None
también deben especificarSecure
, lo que significa que requieren un contexto seguro.
Ambos cambios son retrocompatibles con los navegadores que implementaron correctamente la versión anterior del atributo SameSite
, así como con los navegadores que no admiten versiones anteriores de SameSite
. Su objetivo es reducir la dependencia de los desarrolladores en el comportamiento predeterminado de los navegadores, ya que hacen que el comportamiento de las cookies y el uso previsto sean explícitos. 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, te recomendamos que configures SameSite=Lax
de forma explícita para que la experiencia del usuario sea más coherente en todos los navegadores.
SameSite=None
debe ser segura
Cuando creas cookies para seguimiento 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
Para probar este comportamiento a partir de Chrome 76, habilita about://flags/#cookies-without-same-site-must-be-secure
y, desde Firefox 69, configura network.cookie.sameSite.noneRequiresSecure
en about:config
.
También recomendamos que actualices 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 dependencias de tu sitio para asegurarte de que use el comportamiento nuevo.
SameSite
recetas de galletas
Para 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 artículo de seguimiento Recetas de cookies de SameSite.
Muchas gracias por las contribuciones y los comentarios de Lily Chen, Malte Ubl, Mike West, Rob Dodson, Tom Steiner y Vivek Sekhar.
Imagen hero de Cookie de Pille-Riin Priske en Unsplash