Start · Sprachen · JavaScript · Referenz · WorkerGlobalScope.atob()

WorkerGlobalScope.atob()

Methode

Dekodiert eine Base64-kodierte Zeichenkette innerhalb eines Workers und gibt eine „binäre Zeichenkette“ zurück, in der jedes Zeichen ein Byte (0–255) darstellt.

seit JavaScript Baseline: alle Browser (in Workern seit ca. 2015), Kategorie: webapi

Signatur

WorkerGlobalScope.atob(encodedData)

Beschreibung

atob() („ASCII to binary“) steht in Web Workern, Shared Workern und Service Workern direkt über den globalen Gültigkeitsbereich (self) zur Verfügung. Die Methode funktioniert genauso wie Window.atob() im Hauptthread: Sie nimmt eine Base64-Zeichenkette entgegen und liefert die dekodierten Daten als binäre Zeichenkette zurück, also als String, dessen einzelne Zeichen jeweils ein Byte mit einem Codepunkt von 0 bis 255 repräsentieren.

Typische Einsatzfälle im Worker sind das Dekodieren von Base64-Nutzdaten aus postMessage-Nachrichten, das Auslesen von Data-URLs, das Dekodieren des Payload-Teils eines JWT oder das Umwandeln von Base64-Daten aus einer Push-Nachricht im Service Worker in ein Uint8Array.

Wichtig: Das Ergebnis ist kein UTF-8-dekodierter Text. Enthalten die Originaldaten Mehrbyte-Zeichen (z. B. Umlaute oder Emojis), muss man die binäre Zeichenkette erst in ein Uint8Array umwandeln und dann mit TextDecoder dekodieren. Leerzeichen (ASCII-Whitespace) in der Eingabe werden ignoriert, fehlendes Padding (=) wird toleriert, sofern die Länge sonst gültig ist.

Parameter

Name Typ Default Beschreibung
$encodedData Pflicht string Base64-kodierte Zeichenkette (Alphabet A–Z, a–z, 0–9, +, /, optional =-Padding). Nicht-String-Werte werden vorher in einen String umgewandelt.

Rückgabewert

Typ
string
Beschreibung
Eine binäre Zeichenkette mit den dekodierten Bytes (jedes Zeichen hat einen Codepunkt zwischen 0 und 255).

Beispiele

Einfache Dekodierung im Worker

// worker.js
const decoded = self.atob('SGFsbG8gV29ya2VyIQ==');
console.log(decoded);
Hallo Worker!

UTF-8-Text korrekt dekodieren

// worker.js – Base64 von "Grüße 👋" (UTF-8)
const base64ToText = (b64) => {
  const binary = atob(b64);
  const bytes = Uint8Array.from(binary, (ch) => ch.charCodeAt(0));
  return new TextDecoder().decode(bytes);
};

console.log(base64ToText('R3LDvMOfZSDwn5GL'));
Grüße 👋

Base64-Nachricht vom Hauptthread in Binärdaten umwandeln

// worker.js
self.addEventListener('message', (event) => {
  const { payload } = event.data; // z. B. Base64-kodiertes Bild
  try {
    const binary = atob(payload);
    const bytes = new Uint8Array(binary.length);
    for (let i = 0; i < binary.length; i++) {
      bytes[i] = binary.charCodeAt(i);
    }
    // ArrayBuffer ohne Kopie zurückgeben (Transfer)
    self.postMessage({ size: bytes.byteLength, buffer: bytes.buffer }, [bytes.buffer]);
  } catch (err) {
    self.postMessage({ error: err.name }); // "InvalidCharacterError"
  }
});

// main.js
// const worker = new Worker('worker.js');
// worker.postMessage({ payload: 'iVBORw0KGgo=' });
{ size: 8, buffer: ArrayBuffer(8) }

JWT-Payload im Service Worker lesen (Base64URL)

// sw.js
const decodeJwtPayload = (token) => {
  const part = token.split('.')[1]
    .replace(/-/g, '+')
    .replace(/_/g, '/');
  const padded = part.padEnd(part.length + (4 - (part.length % 4)) % 4, '=');
  const bytes = Uint8Array.from(atob(padded), (c) => c.charCodeAt(0));
  return JSON.parse(new TextDecoder().decode(bytes));
};

const token = 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiI0MiIsIm5hbWUiOiJBbm5hIn0.sig';
console.log(decodeJwtPayload(token));
{ sub: '42', name: 'Anna' }

// Wichtig · Fallstricke

  • Fehler bei ungültiger Eingabe: Enthält die Zeichenkette Zeichen außerhalb des Base64-Alphabets oder hat sie nach Entfernen von Whitespace eine Länge mit Rest 1 (mod 4), wirft atob() eine DOMException vom Typ InvalidCharacterError. Eingaben aus fremden Quellen daher immer in try…catch verarbeiten.
  • Kein Base64URL: Die URL-sichere Variante (- und _ statt + und /, oft ohne Padding, z. B. in JWTs) wird nicht direkt unterstützt – vorher Zeichen ersetzen.
  • Kein UTF-8: Das Ergebnis ist eine Byte-Zeichenkette. Für Text mit Nicht-ASCII-Zeichen TextDecoder verwenden, sonst entsteht „Mojibake“ (z. B. GrüÃe).
  • Performance: Für große Datenmengen ist der Umweg über Strings speicherintensiv. Neuere Engines bieten Uint8Array.fromBase64() (noch nicht überall verfügbar); alternativ fetch('data:application/octet-stream;base64,' + b64) und arrayBuffer().
  • Sicherheit: Base64 ist keine Verschlüsselung. Dekodierte Inhalte (z. B. JWT-Payloads) sind nicht verifiziert und dürfen nicht ungeprüft vertraut werden.
  • Kompatibilität: In allen modernen Browsern in Dedicated, Shared und Service Workern verfügbar. In Node.js ist atob() global vorhanden, gilt dort aber als Legacy – Buffer.from(str, 'base64') wird empfohlen.