Aprende a configurar cookies propias para garantizar la seguridad, la compatibilidad entre navegadores y minimizar las posibilidades de fallas una vez que las cookies de terceros se eliminen gradualmente.
Las cookies pueden ser propias o de terceros en función del contexto del usuario y según el sitio en el que se encuentre el usuario 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 pertenece al mismo sitio que la página y, por lo general, se denomina cookie propia.
Las cookies de dominios que no sean del sitio actual se denominan cookies de terceros.
La buena receta de galletas propias
Si la cookie que estableces 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, se pueden compartir cookies entre sitios, acceder a ellas mediante JavaScript y enviarse a través de conexiones HTTP, lo que conlleva algunos riesgos de privacidad y seguridad. Si bien aún se está trabajando para mejorar el comportamiento predeterminado, a través de Privacy Sandbox y otras propuestas, como las cookies vinculadas al origen, hoy en día puedes realizar muchas acciones 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 con 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 abarcan 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íbe 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 de acuerdo con las reglas __Host
y rechazar la cookie si no es así.
Secure
protege las cookies contra el robo en redes no seguras porque solo permite el envío de cookies a través de conexiones HTTPS. Si no migraste por completo tu sitio a HTTPS, establece esa prioridad.
El atributo Domain
especifica qué hosts pueden recibir una cookie. Si se omite, se restringirá la cookie al host del documento actual, sin incluir los subdominios: La cookie para example.com
se enviará en cada solicitud a example.com
, pero no en las solicitudes a images.example.com
. Si ejecuta diferentes aplicaciones en diferentes subdominios, se reduce el riesgo de que un dominio comprometido permita una puerta a los demás.
Path
indica la ruta de acceso que debe existir en la URL solicitada para que el navegador envíe el encabezado Cookie
. Si estableces Path=/
, la cookie se enviará a todas las rutas de URL de ese dominio. La combinación de ningún Domain
y Path=/
hace que la cookie esté vinculada al origen lo más estrechamente posible, por lo que se comporta de manera similar a otro almacenamiento del cliente, como LocalStorage
. No hay confusión respecto a que example.com/a
podría recibir valores diferentes en example.com/b
.
El atributo HttpOnly
agrega protección contra secuencias de comandos de terceros maliciosas en tus sitios restringiendo el acceso a JavaScript. Permite que una cookie se envíe solo en los encabezados de la solicitud y las hace no disponibles para JavaScript mediante document.cookie
.
Max-Age
limita la vida de una cookie, ya que las sesiones del navegador pueden durar bastante tiempo y no deseas que las cookies queden obsoletas para siempre. Es adecuado para cookies de corta duración, 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; en el ejemplo anterior, se establece en 7776,000 segundos, que es 90 días. Este es un valor predeterminado razonable, que puedes cambiar según tu caso de uso.
SameSite=Lax
restringe la cookie para que se envíe solo en solicitudes del mismo sitio. Es decir, cuando la solicitud coincide con el contexto de navegación actual, es decir, el sitio de nivel superior que el usuario está visitando actualmente y que se muestra en su barra de ubicación. SameSite=Lax
es el valor predeterminado en los navegadores modernos, pero se recomienda especificarlo para que sea compatible con navegadores que pueden tener valores predeterminados diferentes. Si marcas explícitamente la cookie como solo del mismo sitio, la restringirás a tus contextos propios, y no deberías tener que hacer cambios en esa cookie cuando las de terceros desaparezcan.
Para obtener más información sobre los diferentes atributos de cookies, consulta la documentación de Set-Cookie
sobre 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 deberías 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 afirma menos requisitos que Host
: solo requiere que la cookie se configure con el atributo Secure
.
Restricción del acceso a cookies propias en solicitudes iniciadas desde sitios web de terceros
Si bien las cookies SameSite=Lax
no se envían en las solicitudes secundarias entre sitios (por ejemplo, cuando se cargan imágenes incorporadas o iframes en un sitio de terceros), se envían cuando un usuario navega al sitio de origen (por ejemplo, cuando sigue un vínculo de otro sitio).
Puedes restringir aún más el acceso a cookies y deshabilitar el envío de estas junto con 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;