Analizador de data URI

Cómo analizar una data URI

1. Pega la URI en el cuadro. También puede estar dentro de código: una regla CSS con url("data:..."), una etiqueta <img src="data:..."> o una imagen de Markdown. Se extrae la primera URI data:, y la línea de estado lo indica.
2. Lee el resultado: Tipo MIME, Parámetros, Codificación (Base64 o codificación con porcentajes), longitud de la Parte de datos en caracteres, Tamaño decodificado y a qué se parece el contenido en El contenido parece.
3. Debajo se previsualiza el contenido con su SHA-256 y un volcado hex: imágenes, SVG, PDF, audio, vídeo, fuentes, texto, JSON, archivos ZIP y más.
4. Usa Codificación de salida para mantener la URI tal cual o convertirla a Base64 o codificada para URL, elige un Formato de salida como url() de CSS o una etiqueta HTML y copia el resultado. Descargar archivo guarda el contenido.

Qué acepta el analizador

El analizador sigue las reglas para data URL del estándar Fetch, que implementan los navegadores y que son más flexibles que el RFC 2397 original, así que acepta lo mismo que acepta un navegador:

Los saltos de línea y las tabulaciones dentro de la URI se eliminan antes de analizarla, como hacen los navegadores, así que una URI repartida en varias líneas de una hoja de estilos se sigue analizando. ;base64 no distingue mayúsculas de minúsculas, los valores de parámetros entre comillas se desentrecomillan y se acepta Base64 URL-safe. Los escapes de porcentaje se decodifican primero a bytes, así que incluso un cuerpo Base64 escrito como %2B%2F funciona.

Tipo declarado frente a contenido real

El tipo MIME de una data URI no es más que una etiqueta. El analizador compara los bytes decodificados con firmas de archivo conocidas y avisa cuando no coinciden:

• data:image/jpeg;base64,iVBORw0KGgo... da “Declarado image/jpeg, pero el contenido parece PNG.” Los navegadores detectan el formato real de las imágenes rasterizadas, así que a menudo se sigue mostrando, pero el software más estricto lo rechaza.
• Un tipo que no es un tipo MIME válido, como image png con un espacio, genera un aviso aparte.

Para corregir la etiqueta, decodifica el archivo con Descargar archivo y construye una URI limpia con el generador de data URI, o pega la parte Base64 en Base64 a archivo, que propone la extensión y el tipo MIME correctos.

Inspeccionar enlaces data: sospechosos

Las URI data:text/html se han usado para phishing porque toda la página falsa viaja dentro del enlace, sin un servidor detrás que se pueda bloquear. Chrome y Firefox ya no permiten que un enlace lleve una pestaña a ellas, pero siguen apareciendo en correos, códigos QR, documentos y mensajes de chat.

Pegar un enlace así aquí es una forma segura de ver lo que mostraría. Un documento HTML completo se renderiza en un marco aislado que bloquea scripts, formularios y recursos externos, con el código fuente completo debajo. Cualquier otro HTML o script se muestra solo como texto. El contenido SVG se dibuja como imagen, que no ejecuta scripts, y su marcado se lista para que puedas buscar elementos <script> o manejadores on.... La Content Security Policy de la página no deja que los scripts se conecten a nada salvo al contador de visitas de Cloudflare y solo carga imágenes del propio sitio o de URL data: y blob:, así que un píxel de seguimiento o un script remoto del contenido nunca se descarga.

Recodificar y convertir

Codificación de salida convierte una URI a la otra codificación sin tocar el contenido:

• Mantener tal cual devuelve la URI sin saltos de línea.
• Base64 va bien con datos binarios y en contextos donde los caracteres especiales dan problemas.
• Codificado para URL es más corto para texto ASCII simple y SVG, y se lee bien en el código fuente.

Payload, Longitud de la URI y Sobrecarga, bajo la salida, muestran qué codificación es más corta para tus datos. Para SVG en concreto, SVG a data URI ofrece además una codificación optimizada y compara las tres, gzip incluido.

Preguntas frecuentes