Base64 Decodificador

¿Qué es Base64?#

Base64 es una forma de representar datos binarios como texto plano usando 64 caracteres ASCII: A–Z, a–z, 0–9, más + y /. Permite que datos binarios como imágenes, claves y adjuntos de correo electrónico viajen de forma segura a través de sistemas diseñados para texto. Es codificación, no cifrado.

Base64 utiliza un alfabeto fijo de 64 caracteres. Cada valor del 0 al 63 se asigna exactamente a uno de ellos, que es cómo cualquier 3 bytes binarios se convierten en 4 caracteres legibles:

Casi con toda seguridad ya lo has visto. Base64 aparece en cualquier lugar donde los datos binarios necesitan viajar dentro de texto:

• Incrustar una imagen pequeña o icono directamente en HTML o CSS
• Devolver blobs binarios dentro de una respuesta de API JSON
• Codificar adjuntos de correo electrónico (MIME)
• Almacenar claves y certificados en archivos PEM

El truco del data-URI se ve así. La cadena larga es la imagen completa:

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />

¿Por qué existe Base64?#

Los primeros protocolos de red fueron construidos para texto, no para bytes sin procesar. ASCII usaba 7 bits y 128 caracteres, lo cual era adecuado para el inglés pero no para datos binarios. Algunos sistemas alteraban los caracteres de control o reescribían los finales de línea (LF a CR + LF), corrompiendo silenciosamente imágenes y audio en tránsito.

Base64 evita todo eso emitiendo únicamente caracteres con los que todos los sistemas ya están de acuerdo. Base16 y Base32 hacen el mismo trabajo con alfabetos más pequeños, pero Base64 empaca más datos por carácter mientras se mantiene seguro. Por eso ganó.

Cómo funciona la codificación Base64#

Todo el esquema es una idea repetida: tomar 3 bytes (24 bits), volver a dividirlos en cuatro grupos de 6 bits, y buscar cada grupo en el alfabeto. Aquí está la palabra "Logto", codificada a mano.

1. Escribe cada carácter como su binario de 8 bits, usando su código ASCII.
2. Toma 3 bytes a la vez. Eso son 24 bits.
3. Vuelve a dividir los mismos 24 bits en cuatro grupos de 6 bits.
4. Lee cada grupo de 6 bits como un número del 0 al 63.
5. Busca ese número en el alfabeto para obtener un carácter.
6. Si el último fragmento de bytes no alcanza 3, rellena los bits sobrantes con ceros y añade "=" para que cada bloque tenga 4 caracteres.

Paso 1. Convierte cada carácter en su binario de 8 bits:

Paso 2. Toma los primeros tres bytes, "Log", y vuelve a dividir esos mismos 24 bits en cuatro grupos de 6 bits:

Paso 3. Lee cada grupo de 6 bits como un número, luego busca el número en el alfabeto:

"Logto" tiene 5 bytes, no es múltiplo de 3. Los últimos dos bytes, "to", dejan una división de 6 + 6 + 4. Rellena esos últimos 4 bits con ceros para completar un grupo de 6 bits, luego añade un "=" para completar el bloque de 4 caracteres:

Une los bloques:

"Logto"  →  TG9ndG8=

Todos los lenguajes lo incluyen de forma nativa. En Node.js:

const text = 'Logto';
const base64 = Buffer.from(text).toString('base64');
console.log(base64); // TG9ndG8=

Tres reglas se derivan de ese proceso, que vale la pena tener en cuenta:

• 3 entran, 4 salen: La longitud de salida es la entrada redondeada hacia arriba al múltiplo de 4 caracteres más cercano, por lo que los datos codificados siempre son aproximadamente un 33% más grandes.
• "=" significa relleno: Solo aparece cuando la entrada no es múltiplo de 3 bytes.
• El relleno cuenta los sobrantes: Sin "=" significa múltiplo de 3 bytes, un "=" significa 2 bytes sobrantes, dos "=" significa 1 byte sobrante.

¿Cuándo deberías usar Base64?#

Recurre a Base64 cuando los datos binarios deben pasar por un canal exclusivo de texto:

• Recursos en línea: Incrusta una imagen pequeña o fuente en HTML/CSS para ahorrar una solicitud.
• Transportes solo de texto: Coloca datos binarios dentro de JSON, XML o un parámetro de consulta de URL.
• Caracteres restringidos: Mueve datos a través de sistemas que se atascan con bytes de control.

Lo que obtienes a cambio:

• Funciona en todas partes: Cualquier sistema compatible con ASCII puede leerlo, sin negociación de conjunto de caracteres.
• Nada se corrompe: La salida sobrevive a canales que de otro modo dañarían los bytes sin procesar.

Base64 seguro para URL (Base64URL)#

El Base64 estándar depende de tres caracteres que chocan con el funcionamiento de las URLs, cadenas de consulta y nombres de archivo: +, / y el relleno =. Coloca una cadena Base64 normal en un enlace y puede romperse de formas silenciosas:

• + se convierte en un espacio. En una cadena de consulta, muchos servidores interpretan + como un espacio. Así que ?data=ab+cd llega silenciosamente como "ab cd", y los bytes son incorrectos.
• / es un separador de ruta. Un / dentro de un valor puede interpretarse como un nuevo segmento de ruta, y la mayoría de los sistemas de archivos lo rechazan directamente en un nombre de archivo.
• = también está reservado. Separa claves de valores en una cadena de consulta, por lo que el relleno = al final se elimina o se lee incorrectamente.

Puedes codificarlos con porcentaje (+ se convierte en %2B, / en %2F, = en %3D), pero eso infla la cadena y es fácil codificarla dos veces por error.

Base64URL (RFC 4648 §5) soluciona esto en el origen: cambia + por -, cambia / por _, y elimina el relleno =. El resultado se puede usar directamente en una URL, parámetro de consulta o nombre de archivo sin nada que escapar. Lo verás en URLs, nombres de archivo y muchas APIs web.

const base64 = 'TG9ndG8=';
const urlSafe = base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
console.log(urlSafe); // TG9ndG8

Limitaciones (y un gran error conceptual)#

Base64 es una representación, no una solución mágica. Ten tres cosas en mente:

• Es ~33% más grande: 3 bytes se convierten en 4 caracteres, por lo que los datos codificados se inflan aproximadamente un tercio.
• Consume CPU: La codificación y decodificación no son gratuitas a gran volumen o con cargas grandes.
• Es ilegible: Las cadenas opacas dificultan los registros y la depuración.

Preguntas frecuentes#