Curious TechieDev Toolbox
Todas las Guías/Seguridad10 min read

¿Qué es Content Security Policy (CSP) y cómo previene ataques XSS?

Domina CSP Level 3: directivas, implementación estricta de nonces criptográficos, verificación por hash y encabezados defensivos.

Puntos Clave
  • CSP es un encabezado HTTP que restringe desde qué orígenes el navegador puede cargar scripts, estilos y recursos.
  • Constituye la defensa principal frente a ataques de Cross-Site Scripting (XSS) e inyecciones de datos maliciosos.
  • CSP Level 3 prioriza nonces criptográficos estrictos y hashes frente a listas blancas de dominios permisivas.
  • La directiva frame-ancestors 'none' reemplaza a X-Frame-Options para neutralizar el Clickjacking.
  • El encabezado Content-Security-Policy-Report-Only permite auditar políticas en producción sin romper la web.

1. ¿Qué es Content Security Policy (CSP)?

La Content Security Policy (CSP) es una cabecera de respuesta HTTP estandarizada por el W3C que autoriza únicamente fuentes de confianza para cargar y ejecutar contenido en el navegador.

Al restringir el origen de scripts, estilos y llamadas de red, la CSP constituye la defensa más robusta frente a Cross-Site Scripting (XSS) y robo de datos.

2. Desglose de Directivas Fundamentales

DIRECTIVACONTROLAVALOR SEGURO
default-srcReserva para directivas de carga no especificadas'self'
script-srcFuentes permitidas de ejecución JavaScript'self' 'nonce-...'
style-srcOrígenes autorizados de CSS e inline styles'self' 'unsafe-inline'
connect-srcDestinos válidos para Fetch, XHR y WebSockets'self' https://api.domain.com
frame-ancestorsDominios autorizados a incrustar la página en <iframe>'none'

3. Políticas Basadas en Nonce vs Hash

Las primeras versiones de CSP usaban listas de dominios permitidos, pero quedaron obsoletas debido a vulnerabilidades de omisión en CDNs públicas.

CSP Nivel 3 Estricto soluciona este problema mediante nonces criptográficos generados por cada petición:

Content-Security-Policy: script-src 'nonce-rAnd0m123' 'strict-dynamic'; object-src 'none';

4. Frame Ancestors vs X-Frame-Options

Aunque X-Frame-Options: DENY sigue vigente por compatibilidad, la directiva frame-ancestors de CSP es el estándar actual por su control granular sobre orígenes parentales.

5. Plan de Despliegue en 3 Fases

Fase 1: Modo Solo Informe (Report-Only): Despliega <code>Content-Security-Policy-Report-Only</code> con un endpoint de reporte para auditar violaciones sin interrumpir a los usuarios.
Fase 2: Refactorizar Handlers Inline: Elimina atributos <code>onclick="..."</code> y trasládalos a event listeners en ficheros JavaScript independientes.
Fase 3: Imposición Estricta: Cambia a <code>Content-Security-Policy</code> definitivo agregando <code>object-src 'none'</code> para bloquear plugins.