Generador de nonces CSP

Cómo usar el nonce generado

1. Está activo el ajuste predefinido Nonce CSP: 16 bytes aleatorios en Base64, que dan un valor de 24 caracteres terminado en ==.

2. Listo para pegar muestra el encabezado y la etiqueta correspondiente, por ejemplo:

   Content-Security-Policy: script-src 'nonce-SQu4/GjzG3plY6CUwsx8gA=='
   
   <script nonce="SQu4/GjzG3plY6CUwsx8gA==" src="/app.js"></script>
   

3. Úsalo para probar una política en una página de prueba local o en una configuración de staging. Pulsa Generar nuevos para obtener otro valor.

Un nonce copiado de esta página es el mismo en cada petición, así que en producción no protege nada. Los despliegues reales lo generan en el código del servidor, como se muestra más abajo.

Cómo funciona una política basada en nonces

Con script-src 'nonce-…', el navegador solo ejecuta un script si su atributo nonce coincide con el valor del encabezado de esa misma respuesta. Tus propias etiquetas <script> reciben el atributo desde tus plantillas. El marcado que un atacante inyecta a través de un fallo XSS no conoce el valor, porque cambia con cada carga de página, y el navegador se niega a ejecutarlo.

En la práctica importan tres detalles:

• El valor se compara como texto. Cópialo exactamente, = incluido, y mantén las comillas simples alrededor de 'nonce-…' en el encabezado, pero no en el atributo.
• Los navegadores ocultan el atributo. Una vez cargada la página, getAttribute("nonce") devuelve una cadena vacía y los selectores CSS no ven el valor, lo que frena algunos trucos de exfiltración. Los scripts que lo necesitan leen la propiedad nonce.
• 'strict-dynamic' permite que un script de confianza con nonce cargue más scripts sin que cada uno necesite su propio nonce. Es el acompañante habitual de los nonces en una política moderna, y con él el navegador ignora las listas de hosts permitidos como https:.

La política también se puede entregar en una etiqueta <meta http-equiv="Content-Security-Policy">; los nonces funcionan ahí, aunque algunas directivas, como frame-ancestors, no.

Generar un nonce por respuesta

El servidor crea 16 bytes aleatorios en cada petición, los pone en el encabezado y pasa el mismo valor a la plantilla. En Node.js, sin ningún framework:

const crypto = require("crypto");
const http = require("http");

http.createServer((req, res) => {
  const nonce = crypto.randomBytes(16).toString("base64");
  res.setHeader("Content-Security-Policy",
    `script-src 'nonce-${nonce}' 'strict-dynamic'; object-src 'none'; base-uri 'none'`);
  res.setHeader("Content-Type", "text/html; charset=utf-8");
  res.end(`<script nonce="${nonce}" src="/app.js"></script>`);
}).listen(8080);

En Python, base64.b64encode(secrets.token_bytes(16)).decode() da el mismo tipo de valor; los frameworks con middleware de CSP suelen exponerlo como una variable de plantilla. Uses lo que uses, asegúrate de que una caché delante del servidor no guarde el HTML con un nonce y se lo entregue a todos los visitantes. Si se cachea el cuerpo de la página mientras el encabezado cambia, se rompen todos los scripts; si se cachean los dos, el nonce se repite para todo el mundo.

Nonces, hashes y SRI

Un nonce aprueba una etiqueta script para una respuesta. Un hash de CSP aprueba para siempre un script en línea concreto: 'sha256-…' es el SHA-256 en Base64 del texto exacto entre <script> y </script>. Para <script>alert('Hello');</script> es:

script-src 'sha256-gKHd+pSZOJ3MwBsFalomyNobAcinjJ44ArqbIKlcniQ='

Los hashes encajan en sitios estáticos y en fragmentos en línea que nunca cambian; calcúlalos con la herramienta SHA-256 a Base64, con cuidado con los espacios, porque un solo espacio de más cambia el hash. Subresource Integrity es un tercer mecanismo con los mismos digests en Base64: integrity="sha384-…" en un <script src> hace que el navegador compruebe el propio archivo descargado. El generador de hashes SRI construye esas etiquetas.

Preguntas frecuentes