Crear una Content-Security-Policy estricta

Para desarrolladores web que definen recursos permitidos en una página nueva o refuerzan un sitio existente.

Construye una Content-Security-Policy estricta con tus fuentes permitidas y obtén una directiva coherente lista para revisar e integrar.

Cómo usar

Empieza con el origen predeterminado en la primera línea: actúa como respaldo para cualquier tipo de recurso que no enumeres por separado.
En la línea siguiente, enumera los orígenes permitidos para servir scripts, escribiéndolos uno tras otro separados por espacios.
Usa la tercera línea para los orígenes de conexión, es decir, los orígenes que la página puede alcanzar con solicitudes de red.
Construye la política: el conjunto completo de directivas aparece en el área de resultados, listo para leerse de arriba abajo.
Copia la política en tu encabezado o archivo de configuración y luego despliégala en modo de solo informe antes de aplicarla.

Ejemplo

La muestra permite un dominio principal como origen predeterminado, repite ese dominio más un dominio de entrega para los scripts y mantiene un dominio aparte para las conexiones. Después de construir, comprueba que el área de resultados contenga una política coherente en lugar de varias directivas superpuestas.

Entrada

https://example.com
https://example.com https://cdn.example.com
https://api.example.com

Resultado

default-src https://example.com; script-src https://example.com https://cdn.example.com; connect-src https://api.example.com; object-src 'none'; base-uri 'self'; frame-ancestors 'none'

Límites y formatos

La política generada establece reglas, pero nunca prueba tu sitio, así que debes confirmar que todos los recursos legítimos sigan cargándose.
Una política demasiado estricta puede romper funciones sin ningún error visible, por eso se hace primero una pasada en modo de solo informe.
Los orígenes deben encajar entre sí: un dominio usado para scripts pero ausente del origen predeterminado necesita una entrada explícita.
Los formularios, las descargas y el contenido incrustado siguen otras reglas, así que esta política no cubre todo el comportamiento de una página.

Dónde se procesa

La política se ensambla en tu navegador. Los dominios que escribes permanecen en tu dispositivo, no se transmite nada y no queda copia después de cerrar la pestaña, lo que hace práctico redactar primero una configuración interna.

Preguntas frecuentes

¿Cuál es la diferencia entre el origen predeterminado y los orígenes de scripts?

El origen predeterminado es el respaldo para los tipos de recurso que no has enumerado individualmente, mientras que los orígenes de scripts solo gobiernan el código ejecutable. Por tanto, un dominio permitido como origen de scripts no queda automáticamente permitido para estilos, imágenes o conexiones.

¿Por qué se rompe una página después de publicar la política?

Normalmente falta un origen legítimo: una hoja de estilos externa, una fuente, un marco incrustado o un servicio de analítica. Enumera todos los recursos que la página llama realmente, añade los dominios que faltan, vuelve a construir la política y publícala de nuevo.

¿Puedo reutilizar la misma política en varios sitios?

El texto se traslada con facilidad, pero cada sitio atrae sus propios recursos. Trata el texto como punto de partida y luego ajusta los dominios para cada proyecto, para no bloquear algo de lo que dependa la página.