Signatur
Beschreibung
Die Methode atob() („ASCII to binary“) wandelt einen Base64-kodierten String zurück in die ursprünglichen Bytes. Das Ergebnis ist ein sogenannter Binär-String: Jedes Zeichen hat einen Codepunkt zwischen 0 und 255 und entspricht genau einem Byte. Das Gegenstück zum Kodieren ist btoa().
Typische Einsatzfälle sind das Auslesen von Nutzdaten aus Data-URLs, das Dekodieren des Payload-Teils eines JSON Web Tokens (nach Umwandlung von Base64URL in Standard-Base64) oder die Verarbeitung von Base64-Daten aus APIs, etwa eingebetteten Bildern oder Dateien.
Wichtig: atob() liefert kein UTF-8-dekodiertes Text-Ergebnis. Enthalten die ursprünglichen Daten Mehrbyte-Zeichen (Umlaute, Emojis), musst du den Binär-String zuerst in ein Uint8Array umwandeln und anschließend mit TextDecoder dekodieren. Die Methode steht auch in Web Workern über self.atob() bzw. global zur Verfügung.
Parameter
| Name | Typ | Default | Beschreibung |
|---|---|---|---|
| $encodedData Pflicht | string | Ein String mit Base64-kodierten Daten (Alphabet A–Z, a–z, 0–9, +, / sowie optionales Padding =). ASCII-Leerraum wird ignoriert. Werte, die kein String sind, werden in einen String umgewandelt. |
Rückgabewert
Beispiele
Einfachen ASCII-String dekodieren
const encoded = 'SGFsbG8gV2VsdCE=';
const decoded = atob(encoded);
console.log(decoded);
UTF-8-Text mit Umlauten korrekt dekodieren
// btoa-Gegenstück: UTF-8-Bytes von 'Grüße 👋' als Base64
const encoded = 'R3LDvMOfZSDwn5GL';
const binary = atob(encoded);
const bytes = Uint8Array.from(binary, (char) => char.charCodeAt(0));
const text = new TextDecoder().decode(bytes);
console.log(binary.length, text);
Payload eines JWT auslesen (Base64URL)
const decodeJwtPayload = (token) => {
const base64Url = token.split('.')[1];
// Base64URL -> Standard-Base64 inkl. Padding
let base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
base64 += '='.repeat((4 - (base64.length % 4)) % 4);
const bytes = Uint8Array.from(atob(base64), (c) => c.charCodeAt(0));
return JSON.parse(new TextDecoder().decode(bytes));
};
const token = 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiI0MiIsIm5hbWUiOiJBbm5hIn0.sig';
console.log(decodeJwtPayload(token));
Ungültige Eingabe abfangen
const safeAtob = (input) => {
try {
return atob(input);
} catch (err) {
if (err.name === 'InvalidCharacterError') {
console.warn('Kein gültiges Base64:', input);
return null;
}
throw err;
}
};
console.log(safeAtob('abc*'));
// Wichtig · Fallstricke
- Kein UTF-8:
atob()gibt Bytes als Zeichen zurück. Für Text mit Nicht-ASCII-Zeichen immer den Weg überUint8ArrayundTextDecodergehen, sonst entsteht Zeichensalat wieGrüÃe. - Fehler: Bei ungültigen Zeichen oder falscher Länge (z. B. Länge % 4 === 1) wird eine
DOMExceptionmit dem NamenInvalidCharacterErrorgeworfen. - Base64URL: Die URL-sichere Variante (
-und_, oft ohne Padding) wird nicht direkt unterstützt; Zeichen vorher ersetzen. - Sicherheit: Base64 ist keine Verschlüsselung. Dekodierte Daten (z. B. JWT-Payloads) sind nicht verifiziert und dürfen nicht ungeprüft per
innerHTMLeingefügt oder für Berechtigungsentscheidungen genutzt werden. - Performance/Moderne Alternative: Für große Binärdaten ist
Uint8Array.fromBase64()(neu, noch nicht überall verfügbar) effizienter. In Node.js wirdBuffer.from(str, 'base64')empfohlen; das globaleatob()gilt dort als Legacy. - Kompatibilität: In allen Browsern seit Langem verfügbar, auch in Web Workern.