Herramientas HTML

Gratis Generador de politicas Trusted Types

Genere politicas Trusted Types y cabeceras CSP para prevenir XSS basado en DOM con valores tipados para sumideros DOM peligrosos.

Cargando herramienta...

Qué es Generador de politicas Trusted Types?

Trusted Types es una API de seguridad del navegador que previene XSS basado en DOM al requerir valores tipados en lugar de cadenas para sinks DOM peligrosos como innerHTML, eval() y script.src. Los desarrolladores usan trustedTypes.createPolicy() para definir reglas de sanitización que transforman o rechazan cadenas no confiables antes de que lleguen a los sinks de inyección. Combinado con una directiva Content-Security-Policy, Trusted Types cierra una clase importante de vulnerabilidades XSS al exigir que solo las operaciones explícitamente autorizadas puedan asignar valores a propiedades DOM de alto riesgo.

Respuesta rápida

Trusted Types previene XSS basado en DOM bloqueando cadenas que lleguen a sinks DOM peligrosos como innerHTML y eval(). Use trustedTypes.createPolicy() con operaciones createHTML/createScript/createScriptURL, luego aplique con Content-Security-Policy: require-trusted-types-for 'script'. Pruebe siempre primero en modo report-only usando Content-Security-Policy-Report-Only para evitar romper funcionalidades existentes.

Last updated: 2026-05-31

Limitaciones

  • Trusted Types requiere soporte del navegador en Chrome 83+, Edge 83+ y Safari 17+. Firefox no soporta Trusted Types a partir de 2026. Las aplicaciones deben manejar Firefox correctamente sin protección Trusted Types proporcionando un comportamiento alternativo para navegadores no compatibles.
  • Trusted Types no cubre todos los vectores XSS: protege los sinks de inyección DOM (innerHTML, outerHTML, insertAdjacentHTML, eval, document.write) pero no previene XSS a través de atributos URL (href, src), atributos de manejadores de eventos o vectores de inyección basados en CSS.
  • Migrar aplicaciones grandes a Trusted Types requiere una refactorización significativa. Cada uso de innerHTML, insertAdjacentHTML, outerHTML y document.write debe envolverse en una política, lo que puede implicar cientos de cambios en una base de código heredada con manipulación DOM dinámica extensa.

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

Cómo usar esta herramienta

  1. Configure las operaciones permitidas (createHTML, createScript, createScriptURL) y decida cómo maneja cada operación la entrada: rechazo estricto (bloquear toda entrada no confiable), sanitización (pasar por una función sanitizadora) o paso directo para fuentes confiables.
  2. Elija el modo CSP: enforce (require-trusted-types-for 'script' en Content-Security-Policy) bloquea violaciones, o report-only (misma directiva en Content-Security-Policy-Report-Only) registra violaciones sin bloquear. Comience siempre con modo report-only durante la migración.
  3. Seleccione su plataforma de servidor (Nginx o Apache) para generar la configuración de cabecera CSP correspondiente que se integre con sus bloques de servidor o hosts virtuales existentes.
  4. Implemente el archivo JavaScript de la política y la configuración del servidor, luego pruebe su aplicación en modo report-only. Revise los informes de violación en la consola y ajuste las políticas hasta que no aparezcan violaciones, luego cambie al modo enforce.

Para qué puedes usarla

  • Proteger una aplicación web con mucho contenido de XSS almacenado y reflejado al requerir que todos los puntos de inyección HTML pasen por una política Trusted Types con una función sanitizadora configurada.
  • Migrar una aplicación heredada a Trusted Types implementándola primero en modo report-only, corrigiendo los informes de violación incrementalmente en toda la base de código, luego cambiando al modo enforce completo.
  • Aplicar una política Trusted Types estricta en entornos con muchos scripts de terceros donde widgets y embebidos externos cargan contenido dinámico mediante innerHTML, asegurando que todo HTML inyectado pase por la política.

Casos de uso

Ejemplos prácticos

Ejemplo

Migración en modo report-only para una aplicación heredada

Un panel de administración grande usa innerHTML para varios widgets dinámicos. Implemente Trusted Types en modo report-only primero estableciendo require-trusted-types-for 'script' en la cabecera Content-Security-Policy-Report-Only. Recopile informes de violación, refactorice cada widget para usar una política Trusted Types, luego cambie al modo enforce Content-Security-Policy una vez que todas las violaciones estén resueltas.

Ejemplo

Política estricta para un editor CMS

Un CMS con un editor de texto enriquecido necesita renderizar contenido HTML generado por el usuario de forma segura. Cree una política Trusted Types con una función createHTML que pase el HTML a través de un sanitizador tipo DOMPurify antes de devolver un objeto TrustedHTML. Todas las asignaciones innerHTML pasan por esta política, previniendo XSS incluso si contenido malicioso evade el filtrado del lado del servidor.

Errores comunes

  • Implementar Trusted Types en modo enforce sin probar primero en modo report-only: una política estricta puede romper cada funcionalidad que use innerHTML, outerHTML o insertAdjacentHTML. Valide siempre con report-only antes de aplicar enforce.
  • Usar defaultPolicy como un permiso total: trustedTypes.createPolicy('default', { createHTML: (s) => s }) elude toda protección XSS al pasar cada cadena sin modificar. Una política predeterminada debe sanitizar, no pasar directamente.
  • Olvidar que eval() es un sink de Trusted Types: si su aplicación usa JSON.parse() en cadenas compatibles con eval o depende de ejecución de código dinámico, esas llamadas deben pasar por una política createScript o controlarse mediante una directiva CSP script-src separada.

Verificación

  1. Abra la consola DevTools del navegador después de implementar la política Trusted Types en modo enforce. Cualquier violación bloquea la operación y registra un TypeError con detalles sobre la asignación bloqueada y el sink DOM afectado. Verifique que el uso normal de la aplicación produzca cero violaciones.
  2. Cambie temporalmente al modo report-only y use la pestaña Issues en Chrome DevTools para inspeccionar los informes de violación de Trusted Types. Filtre por 'trusted-types' para ver todas las violaciones potenciales agrupadas por tipo de sink y ubicación de origen.

FAQ

Preguntas sobre Generador de politicas Trusted Types

¿Trusted Types protege contra vulnerabilidades XSS existentes?

Sí, si la vulnerabilidad requiere pasar una cadena a un sink DOM como innerHTML, outerHTML o insertAdjacentHTML. Trusted Types obliga a que todas las asignaciones a estos sinks pasen por una política: si no existe política o la política rechaza la entrada, la asignación se bloquea. Sin embargo, Trusted Types no protege contra XSS a través de atributos URL (href, src), manejadores de eventos (onclick, onerror) o inyección del lado del servidor. Se dirige específicamente a los sinks de inyección DOM.

¿Puedo usar Trusted Types con React, Vue o Angular?

Sí, pero la integración varía según el framework. React soporta Trusted Types mediante su contrato de objetos tipados esperado: dangerouslySetInnerHTML acepta objetos TrustedHTML. Vue requiere un envoltorio de política personalizado para enlaces v-html. Angular proporciona integración DomSanitizer que puede configurarse para funcionar con Trusted Types. Consulte la documentación de cada framework para detalles específicos de soporte de Trusted Types.

¿Qué sucede con los scripts de terceros bajo Trusted Types?

Los scripts de terceros que asignan valores a sinks DOM (innerHTML, document.write, outerHTML) se bloquean a menos que pasen por una política Trusted Types. Es posible que necesite crear una política que permita scripts confiables específicos, o añadir una directiva 'trusted-types' en la cabecera CSP que enumere qué nombres de política están permitidos. Los widgets de scripts de terceros comúnmente se rompen bajo Trusted Types y requieren configuración explícita de política.

¿Cómo manejo Trusted Types en modo report-only?

Establezca Content-Security-Policy-Report-Only: require-trusted-types-for 'script' en lugar de la cabecera enforce Content-Security-Policy. El navegador registra las violaciones en la consola y envía informes al endpoint report-uri configurado sin bloquear ninguna operación. Revise todos los informes de violación, cree políticas apropiadas para cada uso de sink, luego cambie al modo enforce moviendo la directiva a la cabecera Content-Security-Policy.

Herramientas relacionadas

Más herramientas html

Prueba también

Prueba también