Base64: codificar y decodificar texto, archivos e imágenes en línea

El codificador es un bisturí para una cadena que puedes pegar, no un CDN.

Si la respuesta depende de un archivo que el navegador no debería sostener, o de criptografía, quédate en CI o en un gestor de secretos.

Quien pueda leer la cadena puede decodificarla. Base64 no tiene clave, ni control de integridad, ni confidencialidad. Un token que parece opaco en un log sigue siendo texto claro tras un decode. Si los bytes deben permanecer secretos, cifra (o no los pongas en el payload). Si deben permanecer auténticos, firma — HMAC o una firma JWT, no Base64 en sí.

RFC 4648 define dos alfabetos. El Base64 estándar usa + y / y suele conservar el padding =. El Base64 URL-safe (JWT, cookies, rutas) usa - y _ y normalmente omite el padding. El interruptor URL-safe de FastMinify hace ambas sustituciones y quita el padding al codificar. En decode URL-safe, el alfabeto se remapea y se restaura el padding. Si el interruptor no coincide con la cadena, obtienes un error de entrada inválida — no un decode «aproximado».

Un JWT compacto son tres segmentos Base64URL separados por puntos: header.payload.signature. Los puntos no son Base64. La herramienta Base64 decodifica una cadena de alfabeto, no un token con puntos. El mensaje de error de la página lo dice: pega solo los caracteres codificados, sin puntos; para un JWT, copia cada parte entre los puntos — o, más simple, abre el decodificador JWT e inspecciona header más payload en un paso.

Base64 infla los datos binarios alrededor de un 33 % (3 bytes se vuelven 4 caracteres ASCII). Un JPEG de 200 KiB se convierte en ~267 KiB de CSS. Ese CSS no tiene caché propio, bloquea el parsing y pelea con el multiplexado HTTP/2. Las data URI ganan para iconos minúsculos que de otro modo costarían una petición. Pierden para héroes, fotos de producto y todo lo que ya minificas como archivo.

Los bytes no cambian. La ortografía sí. El Base64 estándar es lo que emiten el MIME de email y la mayoría de APIs. El Base64 URL-safe es lo que necesitan JWT, cookies firmadas y segmentos de ruta para que + y / no choquen con la sintaxis de query. Una data URI es Base64 estándar con el prefijo data:<mime>;base64, para que un navegador trate la cadena como un recurso.

Tres herramientas, tres entradas. El codificador de texto aplica UTF-8 y luego Base64 sobre una cadena (pegado o archivo de texto). No interpreta un PNG como píxeles. El convertidor de imagen lee los bytes del archivo, comprueba el MIME (PNG, JPEG, GIF, WebP, SVG — MIME vacío rechazado, sin sniff silencioso), limita a 32 MiB y emite una data URI o Base64 crudo. La vista previa usa solo un elemento img: el SVG nunca se inyecta en el DOM como markup. Para SVG-as-CSS con elección utf-8 o Base64 y un snippet CSS dedicado, usa SVG a data URI en el hub SVG (entrada SVG de 512 KiB — otro techo, otro trabajo).

Los desarrolladores los mezclan porque todos «hacen una cadena más segura». Resuelven colisiones distintas. URL encode percent-codifica caracteres reservados de una URI. Las entidades HTML escapan markup para que una cadena quepa en un atributo. Un hash (SHA-256, HMAC) es integridad o autenticidad de un solo sentido — ver hash/HMAC en el hub de codificación, no este artículo. Base64 solo cambia cómo se escriben los bytes.

Base64 toma 24 bits (3 bytes) y los escribe como 4 caracteres de un alfabeto de 64 símbolos. Por eso la salida es más larga: 4/3, unos 33 % más, más padding si la longitud de entrada no es múltiplo de 3. El impuesto es el objetivo — cambias tamaño por un alfabeto que sobrevive al email, a las cadenas JSON y al CSS. Es lo contrario de la minificación. Si el payload es JSON que vas a servir por HTTP, minifica el JSON primero y solo codifica si una capa envolvente exige ASCII; ver la guía de minificación JSON.

El btoa nativo de JavaScript opera sobre una cadena binaria (valores 0–255). Pásale café y lanza o produce una mentira, según el motor. FastMinify codifica los bytes UTF-8 con TextEncoder y luego Base64 — el mismo contrato que Node Buffer.from(text, 'utf8').toString('base64'). La decodificación invierte con TextDecoder. Emoji y CJK sobreviven. Si decodificas un blob que nunca fue texto UTF-8 (un PNG, un flujo gzip), obtienes caracteres de reemplazo, no un archivo — ese blob va a image-to-base64 o a un dump hex, no a un campo de texto.

Cuando la longitud en bytes no es múltiplo de 3, el Base64 estándar añade = o == para que la longitud de la cadena sea múltiplo de 4. Los contextos URL-safe (JWT, algunas cookies) omiten ese padding porque = es un delimitador de query. El encode URL-safe de FastMinify lo quita; el decode URL-safe lo restaura antes de atob. Ejemplos clásicos RFC: f → Zg==, fo → Zm8=, foo → Zm9v.

Abre el codificador/decodificador Base64. Pega el texto (o sube un archivo de texto — techo cliente 32 MiB, la misma familia que otras selecciones de archivo del sitio). Elige Encode o Decode. Deja URL-safe apagado para MIME, payloads data-URI y la mayoría de ejemplos de API. Actívalo para segmentos JWT, cookies firmadas y todo lo que vaya en una ruta. Carga el ejemplo si solo quieres ver el pipeline. Todo permanece en la pestaña.

Abre la herramienta imagen a Base64. Suelta un PNG, JPEG, GIF, WebP o SVG (máx. 32 MiB). Elige data URI para CSS url() e img src, o Base64 crudo para encadenar con otra herramienta. La vista previa pasa por un elemento img; el SVG no se monta como DOM. Los MIME vacíos o exóticos se rechazan — la herramienta no adivina. Tras un icono minúsculo, puedes pegar la URI en CSS. Tras una fotografía, en general no.

La codificación suele ser un paso de un debug más largo. El hub de codificación deja a los vecinos a un clic.

Si la cadena ya vive en un script, el Buffer de Node sigue el mismo camino UTF-8 luego Base64 que FastMinify. Usa base64url cuando el consumidor es una librería JWT.

El par nativo btoa / atob es una API de cadena binaria. Envuélvelo con TextEncoder/TextDecoder o corromperás todo lo que salga de Latin-1. Esa envoltura es exactamente lo que ya hace la herramienta de texto de FastMinify.

Un PEM local, una fixture binaria o un job de CI que no debe abrir un navegador: openssl sigue siendo el martillo correcto. FastMinify no sustituye un pipeline que ya hashea o firma archivos en disco.

Sin install, sin upload, texto UTF-8 más un convertidor de imagen dedicado con un techo honesto de 32 MiB y un interruptor URL-safe. Contrapartida: la herramienta de texto no es un codificador de archivo binario; HEIC/PDF quedan fuera de la herramienta de imagen; la verificación JWT es otra página. Úsala para inspeccionar, enseñar y desbloquear una máquina sin Node — luego mantén openssl o Buffer en CI.