FileReaderSync.readAsBinaryString() — Methode · JavaScript-Referenz

Signatur

FileReaderSync.prototype.readAsBinaryString(blob)

Beschreibung

readAsBinaryString() gehört zum Interface FileReaderSync, das es nur in Web Workern gibt. Die Methode liest den kompletten Inhalt eines Blob bzw. einer File synchron ein und gibt einen String zurück. Jedes Zeichen darin hat einen Code-Point von 0 bis 255 und entspricht genau einem Byte der Rohdaten.

Der Aufruf blockiert, bis die Daten gelesen sind. Deshalb steht die API im Haupt-Thread nicht zur Verfügung: Dort würde sie die Oberfläche einfrieren. Im Worker ist das Blockieren dagegen unproblematisch und macht den Code einfacher, weil man ohne Callbacks und Events auskommt.

Die Methode stammt aus der Zeit vor ArrayBuffer und typisierten Arrays und ist heute veraltet. Für neuen Code nimmt man readAsArrayBuffer() oder die Promise-basierte Methode Blob.prototype.arrayBuffer(). Den Binär-String braucht man eigentlich nur noch für Altbibliotheken, die dieses Format erwarten, oder zusammen mit btoa() für eine Base64-Kodierung.

Parameter

Name	Typ	Default	Beschreibung
$blob Pflicht	Blob \| File		Das `Blob`- oder `File`-Objekt, das gelesen werden soll.

Rückgabewert

Typ

string

Beschreibung

Ein String, in dem jedes Zeichen (charCodeAt() 0–255) genau einem Byte der Eingabedaten entspricht.

Beispiele

Datei im Worker als Binär-String lesen und Bytes ausgeben

// worker.js
self.onmessage = (event) => {
  const file = event.data; // File-Objekt vom Haupt-Thread
  const reader = new FileReaderSync();
  const binary = reader.readAsBinaryString(file);

  // Die ersten 4 Bytes als Hex ausgeben (z. B. PNG-Signatur)
  const head = [...binary.slice(0, 4)]
    .map((c) => c.charCodeAt(0).toString(16).padStart(2, '0'))
    .join(' ');
  self.postMessage({ size: binary.length, head });
};

// main.js
const worker = new Worker('worker.js');
worker.onmessage = (e) => console.log(e.data);
document.querySelector('input[type=file]').addEventListener('change', (e) => {
  worker.postMessage(e.target.files[0]);
});

{ size: 20480, head: '89 50 4e 47' }

Base64-Kodierung mit btoa() im Worker

// worker.js
self.onmessage = ({ data: blob }) => {
  const reader = new FileReaderSync();
  const base64 = btoa(reader.readAsBinaryString(blob));
  self.postMessage(`data:${blob.type};base64,${base64}`);
};

// main.js
const worker = new Worker('worker.js');
worker.onmessage = (e) => console.log(e.data);
worker.postMessage(new Blob(['Hallo'], { type: 'text/plain' }));

data:text/plain;base64,SGFsbG8=

Moderne Alternative: readAsArrayBuffer()

// worker.js – empfohlen statt readAsBinaryString()
self.onmessage = ({ data: blob }) => {
  const reader = new FileReaderSync();
  const bytes = new Uint8Array(reader.readAsArrayBuffer(blob));
  self.postMessage(Array.from(bytes.slice(0, 4)));
};

// main.js
const worker = new Worker('worker.js');
worker.onmessage = (e) => console.log(e.data);
worker.postMessage(new Blob([new Uint8Array([1, 2, 3, 4, 5])]));

[1, 2, 3, 4]

// Wichtig · Fallstricke

Nur in Workern: Im Haupt-Thread ist FileReaderSync nicht definiert. Dort löst new FileReaderSync() einen ReferenceError aus. Im Haupt-Thread verwendet man stattdessen FileReader oder blob.arrayBuffer().
Veraltet: Die Spezifikation rät von readAsBinaryString() ab. Besser ist readAsArrayBuffer(), weil man damit direkt mit echten Bytes in einem Uint8Array arbeitet.
Kein Text-Dekodieren: Das Ergebnis ist kein UTF-8-dekodierter Text. Umlaute und andere Mehrbyte-Zeichen erscheinen als mehrere einzelne Zeichen. Für Text nimmt man readAsText().
Speicher: Die ganze Datei landet als String im Speicher. Das ist ineffizienter als ein ArrayBuffer. Bei großen Dateien besser in Stücken lesen, etwa mit blob.slice() oder blob.stream().
Fehler: Kann die Datei nicht gelesen werden (z. B. weil sie inzwischen gelöscht wurde oder die Berechtigung fehlt), wirft die Methode synchron eine DOMException wie NotFoundError oder NotReadableError. Den Aufruf daher in try…catch einschließen.
Browser: Wird in allen aktuellen Browsern innerhalb von Workern unterstützt.

Siehe auch

FileReaderSync FileReaderSync.readAsArrayBuffer() FileReaderSync.readAsText() FileReaderSync.readAsDataURL() FileReader.readAsBinaryString() Blob.arrayBuffer()