Recetas de galletas propias

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.

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;
Detalles

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.

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;
Detalles

Secure es un prefijo opcional que afirma menos requisitos que Host: solo requiere que la cookie se configure con el atributo Secure.

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;