Je hebt waarschijnlijk Base64-strings door je codebase zien verspreid — in JWT-tokens, HTML <img>-tags, HTTP Authorization-headers of JSON-payloads met bestandsdata. Ze zien eruit als wartaal: SGVsbG8sIFdvcmxkIQ==. Maar er is een eenvoudige reden waarom ze bestaan, en zodra je het begrijpt, houdt Base64 op mysterieus te zijn en wordt het een echt nuttig gereedschap in je gereedschapskist.

Wat Base64 Eigenlijk Is

Base64 is een binair-naar-tekst coderingsschema. Dat is alles. Het neemt willekeurige binaire data — bytes die null-tekens, besturingscodes of elke waarde van 0 tot 255 kunnen bevatten — en stelt ze voor met slechts 64 afdrukbare ASCII-tekens. Het resultaat is een string die veilig door elk tekstgebaseerd kanaal kan reizen zonder gecorrumpeerd of verkeerd geïnterpreteerd te worden.

De formele specificatie staat in RFC 4648, gepubliceerd door de IETF. Het definieert zowel standaard Base64 als de URL-safe variant. De moeite waard om te bookmarken als je ooit een discussie over opvulregels of alfabetkeuzes wilt beslechten.

Het Base64-Alfabet

Het 64-teken alfabet bestaat uit: hoofdletters A–Z (26 tekens), kleine letters a–z (26 tekens), cijfers 0–9 (10 tekens), en twee symbolen: + en /. Dat geeft je precies 64 tekens — vandaar de naam. Het =-teken wordt gebruikt als opvulteken aan het einde wanneer de invoerlengte geen veelvoud van 3 is.

text
ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/

Elk teken codeert precies 6 bits data (2^6 = 64 mogelijke waarden). Dit is het kernmechanisme achter de codering — en de reden voor die ~33% grootte-overhead.

Hoe de Codering Werkt

Het algoritme werkt in blokken van 3 bytes → 4 Base64-tekens. Drie bytes = 24 bits. Verdeel die 24 bits in vier groepen van 6 bits, en elke groep komt overeen met een teken in het Base64-alfabet.

text
Input:  "Man"
Bytes:  M=77 (01001101)  a=97 (01100001)  n=110 (01101110)
Bits:   010011 010110 000101 101110
Index:  19     22     5      46
Output: T      W      F      u     →  "TWFu"

Wanneer de invoer niet deelbaar is door 3, treedt opvulling in werking. Twee resterende bytes worden drie Base64-tekens plus één =. Eén resterend byte wordt twee Base64-tekens plus ==. De opvulling vertelt de decoder hoeveel bytes er daadwerkelijk aanwezig zijn aan het einde — het maakt geen deel uit van de data zelf.

De grootte-overhead: elke 3 bytes invoer worden 4 tekens uitvoer. Dat is een toename van 33% in grootte. Voor kleine strings is het verwaarloosbaar. Voor grote binaire bestanden — een afbeelding van 10 MB wordt ongeveer 13,3 MB Base64 — is de overhead relevant en moet je twee keer nadenken voordat je het direct insluit.

Coderen en Decoderen in JavaScript

Browsers bieden btoa() en atob() als globalen aan. Ze zijn eenvoudig maar hebben een valkuil: ze verwerken alleen Latin-1-tekens (byte-waarden 0–255). Geef een multi-byte Unicode-string direct door en je krijgt een InvalidCharacterError.

js
// Basic browser encoding/decoding
const encoded = btoa('Hello, World!');  // "SGVsbG8sIFdvcmxkIQ=="
const decoded = atob('SGVsbG8sIFdvcmxkIQ==');  // "Hello, World!"

// Safe Unicode version — encode to UTF-8 first
function encodeUnicode(str) {
  return btoa(
    encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, (_, hex) =>
      String.fromCharCode(parseInt(hex, 16))
    )
  );
}

function decodeUnicode(str) {
  return decodeURIComponent(
    atob(str)
      .split('')
      .map(c => '%' + c.charCodeAt(0).toString(16).padStart(2, '0'))
      .join('')
  );
}

const emoji = encodeUnicode('Héllo wörld 🌍');
console.log(emoji);                  // "SMOpbGxvIHfDtnJsZCDwn4yN"
console.log(decodeUnicode(emoji));   // "Héllo wörld 🌍"

Node.js — Buffer Gebruiken

In Node.js is de idiomatische aanpak de Buffer API, die Unicode correct verwerkt en veel schoner is dan de bovenstaande browser-workaround.

js
// Encoding
const encoded = Buffer.from('Hello, World!', 'utf8').toString('base64');
console.log(encoded);  // "SGVsbG8sIFdvcmxkIQ=="

// Decoding
const decoded = Buffer.from('SGVsbG8sIFdvcmxkIQ==', 'base64').toString('utf8');
console.log(decoded);  // "Hello, World!"

// Encoding a file to Base64 (e.g. to embed in a JSON payload)
const fs = require('fs');

function fileToBase64(filePath) {
  const fileBuffer = fs.readFileSync(filePath);
  return fileBuffer.toString('base64');
}

function base64ToFile(base64String, outputPath) {
  const fileBuffer = Buffer.from(base64String, 'base64');
  fs.writeFileSync(outputPath, fileBuffer);
}

const avatarBase64 = fileToBase64('./uploads/avatar.png');
const payload = {
  userId: 'usr_8f3k2',
  avatarData: avatarBase64,
  mimeType: 'image/png'
};

Python — De base64 Module

De standaardbibliotheek van Python bevat een base64-module die codering, decodering en de URL-safe variant verwerkt. De functies werken met bytes-objecten, dus je codeert/decodeert strings doorgaans met een expliciete tekenset.

python
import base64

# Encoding a string
message = "Hello, World!"
encoded = base64.b64encode(message.encode("utf-8"))
print(encoded)           # b'SGVsbG8sIFdvcmxkIQ=='
print(encoded.decode())  # 'SGVsbG8sIFdvcmxkIQ=='

# Decoding
decoded_bytes = base64.b64decode("SGVsbG8sIFdvcmxkIQ==")
print(decoded_bytes.decode("utf-8"))  # 'Hello, World!'

# Encoding a file
with open("report.pdf", "rb") as f:
    pdf_base64 = base64.b64encode(f.read()).decode("utf-8")

# Embedding it in a JSON-compatible structure
import json
payload = {
    "filename": "report.pdf",
    "content": pdf_base64,
    "encoding": "base64"
}
print(json.dumps(payload, indent=2))

URL-Safe Base64

Standaard Base64 gebruikt + en /, die speciale tekens zijn in URL's. Zet een standaard Base64-string in een queryparameter en je krijgt stille corruptie tenzij je het eerst percent-encodeert. URL-safe Base64 (ook gedefinieerd in RFC 4648 §5) lost dit op door + te vervangen door - en / door _. Opvultekens = worden in URL-contexten vaak volledig weggelaten.

js
// Standard → URL-safe conversion in JavaScript
function toBase64Url(base64) {
  return base64
    .replace(/+/g, '-')
    .replace(///g, '_')
    .replace(/=+$/, '');  // strip padding
}

function fromBase64Url(base64url) {
  // Restore padding
  const padded = base64url + '=='.slice(0, (4 - (base64url.length % 4)) % 4);
  return padded.replace(/-/g, '+').replace(/_/g, '/');
}

const standard = btoa('some binary  data');
const urlSafe  = toBase64Url(standard);

console.log(standard);  // "c29tZSBiaW5hcnkAAGRhdGE="
console.log(urlSafe);   // "c29tZSBiaW5hcnkAAGRhdGE"  (safe for URLs)

In Python gebruik je base64.urlsafe_b64encode() en base64.urlsafe_b64decode() — zij voeren de vervanging automatisch uit.

Veelvoorkomende Praktijkgebruiken

  • Afbeeldingen inbedden in HTML/CSS — een data: URI zoals src="data:image/png;base64,iVBORw0KGgo..." elimineert een aparte HTTP-aanvraag. Geweldig voor kleine iconen en sprites; niet geweldig voor grote afbeeldingen vanwege de 33% grootte-overhead.
  • JWT-tokens — de header- en payload-secties van een JSON Web Token zijn URL-safe Base64-gecodeerde JSON-objecten. De drie puntgescheiden delen die je in een JWT ziet zijn Base64Url(header).Base64Url(payload).Base64Url(handtekening).
  • HTTP Basic Authentication — de Authorization: Basic ... header codeert gebruikersnaam:wachtwoord als Base64. Het is gedefinieerd in RFC 7617. Let op: dit is codering, geen versleuteling — gebruik altijd HTTPS.
  • Binaire data inbedden in JSON — JSON heeft geen binair type, dus bestanden, afbeeldingen en certificaten die via API worden verzonden, zijn doorgaans Base64-gecodeerd in een stringveld. Zie de File to Base64 en Image to Base64 tools voor deze workflow.
  • E-mailbijlagen — MIME (het formaat dat ten grondslag ligt aan e-mail) gebruikt Base64 om binaire bijlagen te coderen zodat ze de overdracht via tekstgebaseerde mailrelayservers overleven. Het oorspronkelijke probleem waarvoor Base64 is ontworpen.
  • Binaire data opslaan in databases — wanneer je een kleine blob (een certificaat, een miniatuur) in een tekstkolom of in een JSON-document moet opslaan, is Base64 de standaardkeuze.

Base64 Is GEEN Versleuteling

Dit verwarrt mensen voortdurend — vooral bij het reviewen van code. Base64 is codering, geen versleuteling. Codering is een omkeerbare transformatie die de representatie van data verandert. Versleuteling scrambles data met een geheime sleutel zodat alleen iemand met de sleutel het kan terugdraaien.

Iedereen kan een Base64-string in seconden decoderen — plak het in de Base64 Decoder en je bent klaar. Gebruik Base64 nooit om gevoelige waarden zoals wachtwoorden, API-sleutels of persoonlijke gegevens te "verbergen". Als je vertrouwelijkheid nodig hebt, gebruik echte versleuteling (AES, RSA, of een bibliotheek zoals Web Crypto API in de browser, of cryptography in Python).

Ook de moeite waard om op te merken: Base64 is geen compressie. De uitvoer is altijd groter dan de invoer — met ongeveer een derde. Als je de grootte wilt verkleinen, comprimeer dan eerst (gzip, Brotli, zstd) en codeer dan de gecomprimeerde bytes in Base64 als het kanaal tekst vereist.

Tools voor het Werken met Base64

Als je dagelijks met Base64 werkt, maken snelle tools een echt verschil. Gebruik Base64 Encoder om een tekststring te coderen, Base64 Decoder om Base64-waarden te decoderen en te inspecteren, File to Base64 om binaire bestanden te converteren voor API-payloads of opslag, en Image to Base64 om data-URI's te genereren voor het direct inbedden van afbeeldingen in HTML of CSS.

Samenvatting

Base64 bestaat om één specifiek probleem op te lossen: binaire data door tekstgebaseerde kanalen krijgen zonder corruptie. Het doet dit door elke 3 bytes invoer te mappen op 4 afdrukbare ASCII-tekens, met een alfabet van 64 tekens (A–Z, a–z, 0–9, +, /). Het resultaat is veilig voor e-mail, HTTP-headers, JSON-velden en URL's (met de URL-safe variant). De afweging is een vaste toename van 33% in grootte. Het is geen versleuteling, het is geen compressie — het is een transparante, omkeerbare codering. Zodra je dat hebt geïnternaliseerd, weet je direct wanneer je het moet gebruiken en wanneer een ander gereedschap beter past.

← All Base64 articles Browse all categories →