Guía de herramienta

Cómo usar Base64

Qué es Base64, por qué NO es cifrado, cómo funciona el alfabeto y sus casos de uso prácticos en el desarrollo web.

¿Qué es Base64?

Base64 es un esquema de codificación (no cifrado) que convierte datos binarios en texto ASCII usando un alfabeto de 64 caracteres. Se usa principalmente cuando necesitas transmitir datos binarios por canales que solo soportan texto.

Base64 NO es cifrado. Cualquier persona puede decodificar un string en Base64 sin ninguna clave. No uses Base64 para "proteger" información sensible — solo úsalo para codificación de formato.

El alfabeto Base64

Base64 usa 64 caracteres: las 26 letras mayúsculas, 26 minúsculas, los dígitos 0-9, y los símbolos + y /. El carácter = se usa como padding.

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=

A-Z (mayúsculas, índices 0-25)

a-z (minúsculas, índices 26-51)

0-9 +/ (índices 52-63)

Cómo funciona la codificación

Base64 toma grupos de 3 bytes (24 bits) y los convierte en 4 caracteres del alfabeto (6 bits cada uno). Por eso un texto codificado en Base64 es aproximadamente un 33% más largo que el original.

Texto:"Hola"→SG9sYQ==Texto:"MeshiCode"→TWVzaGlDb2Rl

Casos de uso

Data URLs en imágenes

Incrustar imágenes directamente en HTML/CSS sin archivos externos.

<img src="data:image/png;base64,iVBORw0KGgo..." />

Auth Basic en HTTP headers

El esquema HTTP Basic Auth codifica usuario:contraseña en Base64.

Authorization: Basic dXN1YXJpbzpjb250cmFzZW5hCg==

Transmisión de datos binarios

Enviar archivos binarios (PDF, imágenes) en JSON o XML donde solo se permite texto.

{ "archivo": "JVBERi0xLjQKJcOkw7zDtsOfCjIgMCBv..." }

Cómo usar en JavaScript

En el navegador: btoa() y atob()

Codificar y decodificar texto ASCII

"color:rgba(255,255,255,0.35)">// Codificar (text → Base64)
const texto = "Hola, MeshiCode!";
const codificado = btoa(texto);
console.log(codificado); "color:rgba(255,255,255,0.35)">// "SG9sYSwgTWVzaGlDb2RlIQ=="

"color:rgba(255,255,255,0.35)">// Decodificar (Base64 → text)
const decodificado = atob(codificado);
console.log(decodificado); "color:rgba(255,255,255,0.35)">// "Hola, MeshiCode!"

"color:rgba(255,255,255,0.35)">// Importante: btoa() solo acepta caracteres Latin-1
"color:rgba(255,255,255,0.35)">// Para Unicode usa encodeURIComponent primero:
const textoUnicode = "Año nuevo 🎉";
const encoded = btoa(encodeURIComponent(textoUnicode));
const decoded = decodeURIComponent(atob(encoded));

En Node.js: Buffer

Con el módulo Buffer nativo

"color:rgba(255,255,255,0.35)">// Codificar
const texto = "Hola, MeshiCode!";
const codificado = Buffer.from(texto, "utf-8").toString("base64");
console.log(codificado); "color:rgba(255,255,255,0.35)">// "SG9sYSwgTWVzaGlDb2RlIQ=="

"color:rgba(255,255,255,0.35)">// Decodificar
const decodificado = Buffer.from(codificado, "base64").toString("utf-8");
console.log(decodificado); "color:rgba(255,255,255,0.35)">// "Hola, MeshiCode!"

"color:rgba(255,255,255,0.35)">// Codificar un archivo binario
import { readFileSync } from "fs";
const imagen = readFileSync("./foto.jpg");
const imagenBase64 = imagen.toString("base64");
const dataURL = `data:image/jpeg;base64,${imagenBase64}`;

Base64url (variante para URLs)

Para JWT y URLs — reemplaza + por - y / por _

"color:rgba(255,255,255,0.35)">// Base64 estándar → Base64url (seguro para URLs)
function toBase64url(base64) {
  return base64.replace(/\+/g, "-").replace(/\"color:rgba(255,255,255,0.35)">//g, "_").replace(/=+$/, "");
}

"color:rgba(255,255,255,0.35)">// Base64url → Base64 estándar
function fromBase64url(base64url) {
  const padding = "=".repeat((4 - (base64url.length % 4)) % 4);
  return (base64url + padding).replace(/-/g, "+").replace(/_/g, "/");
}

Herramienta relacionada

Codificador Base64

Codifica y decodifica texto o archivos en Base64 directamente en el navegador. Sin servidores, sin límites.

Abrir codificador Base64 →