new FileReaderSync() — Methode · JavaScript-Referenz

Signatur

new FileReaderSync()

Beschreibung

Der Konstruktor new FileReaderSync() erzeugt einen synchronen Datei-Leser. Anders als FileReader arbeitet er nicht mit Events oder Callbacks: Methoden wie readAsText(), readAsArrayBuffer() oder readAsDataURL() geben das Ergebnis direkt zurück.

Weil synchrones Lesen den ausführenden Thread blockiert, steht FileReaderSync ausschließlich in Web Workers zur Verfügung (DedicatedWorkerGlobalScope, SharedWorkerGlobalScope, nicht jedoch in Service Workern). Im Haupt-Thread (window) ist der Konstruktor nicht definiert.

Typischer Einsatz: Der Haupt-Thread schickt ein File oder einen Blob per postMessage() an einen Worker, der die Daten dort ohne Promise-Verschachtelung liest, verarbeitet (z. B. parsen, hashen, komprimieren) und das Ergebnis zurücksendet. Der Konstruktor erwartet keine Argumente.

Rückgabewert

Typ

FileReaderSync

Beschreibung

Eine neue FileReaderSync-Instanz mit den Methoden readAsArrayBuffer(), readAsText(), readAsDataURL() und (veraltet) readAsBinaryString().

Beispiele

Instanz im Worker erstellen und Text lesen

// worker.js
self.addEventListener('message', (event) => {
  const file = event.data;
  const reader = new FileReaderSync();
  const text = reader.readAsText(file, 'utf-8');
  const zeilen = text.split('\n').length;
  self.postMessage({ name: file.name, zeilen });
});

{ name: 'daten.csv', zeilen: 1024 }

Datei aus dem Haupt-Thread an den Worker übergeben

// main.js
const worker = new Worker('worker.js');
const input = document.querySelector('input[type=file]');

input.addEventListener('change', () => {
  const [file] = input.files;
  if (file) worker.postMessage(file);
});

worker.addEventListener('message', ({ data }) => {
  console.log(`${data.name}: ${data.zeilen} Zeilen`);
});

daten.csv: 1024 Zeilen

SHA-256-Hash einer Datei im Worker berechnen

// hash-worker.js
self.onmessage = async ({ data: blob }) => {
  try {
    const buffer = new FileReaderSync().readAsArrayBuffer(blob);
    const digest = await crypto.subtle.digest('SHA-256', buffer);
    const hex = [...new Uint8Array(digest)]
      .map((b) => b.toString(16).padStart(2, '0'))
      .join('');
    self.postMessage({ ok: true, hex });
  } catch (err) {
    // z. B. NotReadableError, wenn die Datei nicht mehr lesbar ist
    self.postMessage({ ok: false, fehler: err.name });
  }
};

{ ok: true, hex: 'e3b0c44298fc1c14…' }

// Wichtig · Fallstricke

Nur in Workern: Im Haupt-Thread wirft new FileReaderSync() einen ReferenceError. Mit typeof FileReaderSync !== 'undefined' lässt sich die Verfügbarkeit prüfen. In Service Workern ist die Schnittstelle ebenfalls nicht verfügbar.
Blockierend: Das Lesen großer Dateien blockiert den Worker vollständig – er reagiert währenddessen nicht auf weitere Nachrichten. Bei sehr großen Dateien besser stückweise mit blob.slice() lesen.
Moderne Alternative: Blob.prototype.text(), arrayBuffer() und stream() arbeiten Promise-basiert, funktionieren überall (auch im Haupt-Thread) und sind für neuen Code oft die bessere Wahl.
Lesefehler werden als Ausnahmen geworfen (NotFoundError, NotReadableError, SecurityError) – also in try…catch kapseln.
readAsBinaryString() ist veraltet; stattdessen readAsArrayBuffer() verwenden.

Siehe auch

FileReaderSync FileReaderSync.prototype.readAsText() FileReaderSync.prototype.readAsArrayBuffer() FileReaderSync.prototype.readAsDataURL() FileReader Blob Worker