#491 · Herramienta para desarrolladores

Data URI Parser

Analiza un Data URI completo y separa su tipo MIME, parámetros, modo de codificación y carga útil. La herramienta decodifica contenido percent-encoded o Base64 en el navegador, calcula el tamaño aproximado en bytes y muestra una vista utilizable del contenido cuando es texto. Resulta útil para revisar imágenes incrustadas, fragmentos CSS, recursos SVG o datos generados por aplicaciones sin enviar la entrada a un servidor.

Datos de entrada

Data URI completo
Espacio publicitario

Cómo usar esta herramienta para desarrolladores

  1. Pega un URI que empiece por data:.
  2. Ejecuta el análisis para separar metadatos y payload.
  3. Comprueba el tipo MIME, los parámetros y el tamaño estimado.
  4. Copia o descarga la carga útil decodificada si necesitas reutilizarla.

Qué hace esta herramienta para desarrolladores

El resultado muestra cada componente del esquema Data URI y, cuando es posible, presenta la carga útil ya decodificada. Para datos binarios se ofrece una representación informativa en lugar de fingir que el contenido es texto legible.

Se aplica la sintaxis data:[mediatype][;parámetros][;base64],payload. El payload se decodifica con Base64 o percent-decoding según corresponda.

El tamaño indicado corresponde a los bytes decodificados estimados en el navegador, no al tamaño del recurso una vez comprimido por HTTP.

Ejemplo

Entrada:

data:text/plain;charset=utf-8,Hola%20mundo

Salida esperada: tipo text/plain, charset utf-8 y contenido Hola mundo.

Casos de uso

  • Inspeccionar imágenes o SVG embebidos en HTML y CSS.
  • Depurar recursos generados por canvas o FileReader.
  • Comprobar si un payload usa Base64 o percent-encoding.
  • Estimar cuánto añade un Data URI al documento.

Consejos para obtener resultados fiables

  • Conserva el prefijo data: completo.
  • Revisa el tipo MIME antes de guardar el contenido.
  • No interpretes texto binario como UTF-8 sin conocer su formato.
  • Para payloads muy grandes, compara el tamaño con un archivo externo.

Detalles del procesamiento

El parser divide la cabecera por punto y coma, reconoce el marcador base64 y trata el resto como parámetros. En percent-encoding se usa decodeURIComponent; en Base64 se convierte la secuencia a bytes antes de generar la vista de texto.

El navegador no puede identificar por sí solo todos los formatos binarios ni validar que el contenido decodificado coincida semánticamente con el tipo MIME declarado.

Preguntas frecuentes

¿Cómo puedo saber si un Data URI usa Base64 o percent-encoding?

Si la cabecera contiene el marcador ;base64, el payload se interpreta como Base64. Si no aparece, se procesa como contenido percent-encoded.

¿Qué significa el tipo MIME dentro de un Data URI?

Indica el tipo declarado del contenido, por ejemplo text/plain, image/svg+xml o image/png. No garantiza que los bytes realmente correspondan a ese formato.

¿Por qué un Data URI Base64 ocupa más que el archivo original?

Base64 representa cada tres bytes mediante cuatro caracteres, por lo que normalmente añade alrededor de un tercio de tamaño antes de considerar la cabecera del URI.

¿Puedo analizar un Data URI con caracteres Unicode?

Sí. El contenido percent-encoded se decodifica como texto Unicode cuando la secuencia es válida, y el resultado conserva caracteres internacionales.

¿Es seguro pegar un Data URI sensible en esta página?

El procesamiento principal se realiza localmente en el navegador y no necesita una API externa. Aun así, evita compartir o guardar datos sensibles fuera de tu entorno de confianza.

Resumen técnico

ElementoValor
CategoríaCodificación y decodificación
Número491
EjecuciónLocal en el navegador
DependenciasNinguna