¿Qué es Subresource Integrity (SRI)?

Subresource Integrity (SRI) es una característica de seguridad que permite a los navegadores verificar que los archivos cargados desde fuentes externas — como CDNs — no han sido alterados ni comprometidos. Cuando añades un atributo integrity a una etiqueta <script> o <link>, el navegador compara el hash del archivo descargado con el hash esperado. Si no coinciden, el navegador bloquea el recurso.

¿Por qué usar SRI?

Cargar JavaScript o CSS desde CDNs de terceros es conveniente, pero introduce un riesgo de seguridad. Si el CDN se ve comprometido, los atacantes podrían inyectar código malicioso en tu sitio web. SRI elimina este riesgo asegurando que solo se ejecute la versión exacta y verificada de un archivo.

Prevenir Ataques a la Cadena de Suministro

Bloquea scripts alterados para que no se ejecuten en tu sitio y protégete contra recursos CDN comprometidos.

Proteger Datos de Usuarios

Detén el código inyectado de robar credenciales, tokens de sesión o información sensible del usuario.

Cumplir con Estándares de Seguridad

SRI es recomendado por OWASP y W3C como una práctica recomendada de seguridad web.

¿Cómo Funciona?

SRI utiliza funciones hash criptográficas (SHA-256, SHA-384 o SHA-512) para crear una huella digital del contenido del archivo. Este hash se añade a la etiqueta HTML como un atributo integrity, junto con crossorigin="anonymous" para habilitar la verificación basada en CORS.

Cómo funciona: Cuando el navegador descarga un recurso, calcula el hash del archivo recibido y lo compara con el hash de integridad que proporcionaste. Si coinciden, el recurso se ejecuta. Si no, el navegador lo bloquea completamente.

Cómo Usar el Generador de Hash SRI

Pega el Contenido del Archivo

Copia el contenido completo del archivo JavaScript o CSS que deseas proteger y pégalo en el área de texto Contenido. El hash se genera automáticamente mientras escribes o pegas.

Elige un Algoritmo

Selecciona un algoritmo hash de la barra de herramientas. SHA-384 está seleccionado por defecto y es la opción recomendada para SRI. También puedes usar SHA-256 o SHA-512 según tus requisitos.

Establece el Tipo de Etiqueta

Elige si el recurso es un <script> (JavaScript) o <link> (hoja de estilo CSS). Si ingresas una URL con extensión .js o .css, el tipo de etiqueta se detecta automáticamente.

Añade una URL de Recurso (Opcional)

Ingresa la URL del CDN del recurso en el campo URL de Recurso. Esta URL se utilizará en el atributo src o href de la etiqueta HTML generada. Si se deja vacío, se usa una URL de marcador de posición.

Copia la Salida

Copia el hash de integridad solo o la etiqueta HTML completa usando los botones de copiar. Pega la etiqueta directamente en tu HTML para habilitar la protección SRI.

Consejo profesional: Siempre prueba tus recursos protegidos con SRI en un entorno de desarrollo primero para asegurar que el hash coincida y el recurso se cargue correctamente.

Características Principales

Múltiples Algoritmos Hash

Genera hashes SRI usando SHA-256, SHA-384 o SHA-512. SHA-384 es el algoritmo predeterminado y recomendado según la especificación SRI de W3C.

SHA-256 para seguridad básica
SHA-384 (recomendado)
SHA-512 para máxima fortaleza
Cambio instantáneo de algoritmo

Detección Automática del Tipo de Etiqueta

Cuando ingresas una URL de recurso, la herramienta detecta automáticamente si es un archivo JavaScript o una hoja de estilo CSS y selecciona el tipo de etiqueta apropiado.

Detecta archivos .js automáticamente
Detecta archivos .css automáticamente
Anulación manual disponible
Análisis inteligente de URL

Salida HTML Lista para Usar

Obtén una etiqueta HTML completa con los atributos integrity y crossorigin ya incluidos. Simplemente cópiala y pégala en tu documento HTML.

Etiquetas <script> completas
Etiquetas <link> completas
Atributos CORS incluidos
Sin necesidad de edición manual

Copiar con Un Clic

Copia el valor del hash de integridad o la etiqueta HTML completa con un solo clic. Una confirmación visual aparece cuando el contenido se copia al portapapeles.

Copia solo el hash
Copia la etiqueta HTML completa
Confirmación visual
Acceso instantáneo al portapapeles

Procesamiento del Lado del Cliente

Todo el cálculo de hash se realiza completamente en tu navegador usando la Web Crypto API. El contenido de tu archivo nunca se carga en ningún servidor.

100% basado en navegador
Sin cargas a servidor
Privacidad completa
Funciona sin conexión

Generación en Tiempo Real

Los valores hash se calculan instantáneamente mientras escribes o pegas contenido. No hay necesidad de hacer clic en botones de generar o esperar procesamiento.

Cálculo instantáneo de hash
Actualizaciones de vista previa en vivo
Sin retrasos ni esperas
Procesamiento eficiente

Preguntas Frecuentes

¿Qué algoritmo debo usar para SRI?

SHA-384 es recomendado por W3C y es el algoritmo más ampliamente utilizado para SRI. Proporciona un equilibrio fuerte entre seguridad y rendimiento. SHA-256 y SHA-512 también son compatibles con todos los navegadores modernos.

Mejor práctica: Usa SHA-384 a menos que tengas requisitos específicos para SHA-256 (tamaño de hash más pequeño) o SHA-512 (seguridad máxima).

¿Necesito el atributo crossorigin?

Sí. El atributo crossorigin="anonymous" es requerido para que SRI funcione con recursos cargados desde un origen diferente (como un CDN). Sin él, el navegador no puede verificar la integridad de los recursos de origen cruzado.

El valor anonymous significa que no se envían credenciales (cookies, autenticación HTTP) con la solicitud, que es la configuración estándar para recursos CDN públicos.

¿Qué sucede si el hash no coincide?

Si el hash del archivo descargado no coincide con el atributo integrity, el navegador se negará a ejecutar el script o se negará a aplicar la hoja de estilo. Esto protege tu sitio de cargar archivos comprometidos.

Importante: El navegador también registrará un error en la consola, lo que te ayuda a identificar cuándo un recurso ha sido modificado o cuándo necesitas actualizar el hash de integridad después de una actualización legítima del archivo.

¿El CDN necesita soportar CORS?

Sí. El servidor que aloja el recurso debe incluir el encabezado Access-Control-Allow-Origin para que funcione la verificación SRI. La mayoría de CDNs populares (jsDelivr, cdnjs, unpkg) ya soportan CORS.

Si estás usando un CDN que no soporta CORS, la verificación SRI fallará y el recurso no se cargará. En este caso, necesitarás cambiar a un CDN habilitado para CORS u alojar el recurso en tu propio dominio.

¿Mi contenido se envía a un servidor?

No. Todo el hash se realiza localmente en tu navegador usando la Web Crypto API. El contenido de tu archivo nunca sale de tu dispositivo.

Garantía de privacidad: Esta herramienta funciona completamente sin conexión una vez cargada. Incluso puedes desconectarte de internet y continuar generando hashes SRI para tus archivos.

¿Puedo usar múltiples algoritmos en una etiqueta?

Sí, la especificación SRI permite múltiples hashes separados por espacios (por ejemplo, sha256-abc sha384-xyz). El navegador utilizará el algoritmo más fuerte que soporte. Esta herramienta genera un hash a la vez — puedes combinarlos manualmente si es necesario.

Usar múltiples hashes proporciona compatibilidad hacia atrás con navegadores más antiguos mientras asegura que los navegadores más nuevos usen el algoritmo más fuerte disponible.