Obtén información para configurar cookies propias y garantizar la seguridad, la compatibilidad entre navegadores y minimizar las posibilidades de que se produzcan errores una vez que se eliminen gradualmente las cookies de terceros.
Las cookies pueden ser propias o de terceros en relación con el contexto del usuario, según el sitio en el que se encuentre en ese momento. Si el dominio y el esquema registrables de la cookie coinciden con la página de nivel superior actual, es decir, lo que se muestra en la barra de direcciones del navegador, se considera que la cookie proviene del mismo sitio que la página y, por lo general, se denomina cookie propia.
Por lo general, las cookies de dominios distintos del sitio actual se denominan cookies de terceros.
La buena receta de cookies propias
Si la cookie que configuras no se usa en todos los sitios, por ejemplo, se usa para administrar sesiones en tu sitio y nunca se usa en un iframe entre sitios, esa cookie siempre se usa en un contexto propio.
De forma predeterminada, las cookies se pueden compartir entre sitios, a las que se puede acceder a través de JavaScript y enviar a través de conexiones HTTP, lo que conlleva algunos riesgos de privacidad y seguridad. Si bien se está trabajando para mejorar el comportamiento predeterminado, a través de Privacy Sandbox y otras propuestas, como las cookies vinculadas al origen, hoy puedes hacer mucho si configuras atributos adicionales en tus cookies.
La siguiente configuración es una práctica recomendada que garantiza la seguridad y la compatibilidad entre navegadores para la mayoría de las cookies propias. Te proporcionará una base segura, que puedes ajustar para abrir permisos solo cuando sea necesario. En este artículo, también se abordan las variaciones de recetas para algunos casos de uso específicos.
La receta
Set-Cookie:
__Host-cookie-name=cookie-value;
Secure;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Lax;
Host
es un prefijo opcional que hace que algunos atributos sean obligatorios y prohíba otros:
Secure
debe estar presente- Se debe omitir
Domain
. Path
debe ser/
Con Host
agregado, puedes confiar en el navegador para verificar si estos atributos están configurados de acuerdo con las reglas de __Host
y rechazar la cookie si no es así.
Secure
protege las cookies contra el robo en redes no seguras, ya que solo permite enviar cookies a través de conexiones HTTPS. Si aún no migraste tu sitio a HTTPS, hazlo una prioridad.
El atributo Domain
especifica qué hosts pueden recibir una cookie. Si lo omites, la cookie se restringirá al host del documento actual, sin incluir los subdominios: la cookie de example.com
se enviará en cada solicitud a example.com
, pero no en las solicitudes a images.example.com
. Si tienes diferentes apps que se ejecutan en diferentes subdominios, se reduce el riesgo de que un dominio comprometido permita el acceso a los demás.
Path
indica la ruta que debe existir en la URL solicitada para que el navegador envíe el encabezado Cookie
. Si configuras Path=/
, la cookie se enviará a todas las rutas de URL de ese dominio. La combinación de no Domain
y Path=/
hace que la cookie esté vinculada al origen lo más cerca posible, por lo que se comporta de manera similar a otros almacenamientos del cliente, como LocalStorage
. No hay confusión de que example.com/a
pueda recibir valores diferentes a example.com/b
.
El atributo HttpOnly
agrega cierta protección contra secuencias de comandos de terceros maliciosas en tus sitios, ya que restringe el acceso de JavaScript. Permite que una cookie se envíe solo en los encabezados de solicitud y las hace inaccesibles para JavaScript con document.cookie
.
Max-Age
limita la vida de una cookie, ya que las sesiones del navegador pueden durar bastante tiempo y no quieres que las cookies inactivas permanezcan para siempre. Es útil para las cookies a corto plazo, como las sesiones de usuario o incluso las más cortas, como los tokens para el envío de formularios. Max-Age
se define en segundos y, en el ejemplo anterior, se establece en 7776000 segundos, que son 90 días. Esta es una configuración predeterminada razonable que puedes cambiar según tu caso de uso.
SameSite=Lax
restringe la cookie para que solo se envíe en solicitudes del mismo sitio. Es decir, cuando la solicitud coincide con el contexto de navegación actual, el sitio de nivel superior que el usuario está visitando actualmente y que se muestra en la barra de ubicación. SameSite=Lax
es el valor predeterminado en los navegadores modernos, pero es recomendable especificarlo para garantizar la compatibilidad con los navegadores que pueden tener valores predeterminados diferentes. Si marcas explícitamente la cookie como solo del mismo sitio, la restringes a tus contextos propios y no deberías tener que realizar cambios en ella cuando desaparezcan las cookies de terceros.
Para obtener más información sobre los diferentes atributos de cookies, consulta la documentación de Set-Cookie
en MDN.
Receta de cookie propia para sitios con subdominios
Si tienes un sitio con subdominios y deseas tener una sesión en todos ellos, el prefijo Host
puede ser demasiado restrictivo. Por ejemplo, news.site
podría tener subdominios para temas, como finance.news.site
y sport.news.site
, y te gustaría tener una sesión de usuario en todos ellos. En ese caso, usa el prefijo __Secure
en lugar de __Host
y especifica Domain
.
La receta
Set-Cookie:
__Secure-cookie-name=cookie-value;
Secure;
Domain=news.site;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Lax;
Secure
es un prefijo opcional que establece menos requisitos que Host
: solo requiere que la cookie se configure con el atributo Secure
.
Restringir el acceso a las cookies propias en las solicitudes que se inician desde sitios web de terceros
Si bien las cookies SameSite=Lax
no se envían en subsolicitudes entre sitios (por ejemplo, cuando se cargan imágenes o iframes incorporados en un sitio de terceros), se envían cuando un usuario navega al sitio de origen (por ejemplo, cuando sigue un vínculo desde otro sitio).
Puedes restringir aún más el acceso a las cookies y no permitir que se envíen junto con las solicitudes iniciadas desde sitios web de terceros con SameSite=Strict
. Esto es útil cuando tienes cookies relacionadas con funciones que siempre estarán detrás de una navegación inicial, como cambiar una contraseña o realizar una compra.
La receta
Set-Cookie:
__Host-cookie-name=cookie-value;
Secure;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Strict;