FileReader.error — Eigenschaft · JavaScript-Referenz

Signatur

FileReader.error

Beschreibung

Die Eigenschaft error eines FileReader-Objekts enthält eine DOMException, sobald ein Lesevorgang (readAsText(), readAsArrayBuffer(), readAsDataURL() usw.) fehlgeschlagen ist. Solange kein Fehler aufgetreten ist, der Lesevorgang noch läuft oder erfolgreich war, ist der Wert null.

Man wertet error typischerweise im error-Event-Handler (onerror) oder im loadend-Handler aus, um dem Nutzer eine verständliche Meldung anzuzeigen. Über error.name lässt sich die Fehlerursache unterscheiden, z. B. NotFoundError (Datei nicht mehr vorhanden), NotReadableError (Datei nicht lesbar, z. B. fehlende Berechtigung oder Datei wurde nach der Auswahl geändert), SecurityError oder AbortError (nach abort()).

Wird ein neuer Lesevorgang gestartet, setzt der FileReader error wieder auf null zurück. Da die Eigenschaft schreibgeschützt ist, haben Zuweisungen keine Wirkung.

Rückgabewert

Typ

DOMException | null

Beschreibung

Eine DOMException mit name und message, die den Lesefehler beschreibt, oder null, wenn kein Fehler aufgetreten ist.

Beispiele

Fehler im onerror-Handler auswerten

const input = document.querySelector('input[type="file"]');

input.addEventListener('change', () => {
  const file = input.files[0];
  if (!file) return;

  const reader = new FileReader();

  reader.onload = () => {
    console.log('Inhalt:', reader.result.slice(0, 100));
  };

  reader.onerror = () => {
    const err = reader.error;
    console.error(`Lesefehler (${err.name}): ${err.message}`);
  };

  reader.readAsText(file);
});

Lesefehler (NotReadableError): The requested file could not be read, typically due to permission problems that have occurred after a reference to a file was acquired.

FileReader in ein Promise verpacken

const readFileAsText = (file) =>
  new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.onload = () => resolve(reader.result);
    // reader.error ist eine DOMException und eignet sich direkt als Ablehnungsgrund
    reader.onerror = () => reject(reader.error);
    reader.readAsText(file);
  });

const handleFile = async (file) => {
  try {
    const text = await readFileAsText(file);
    console.log(`${text.length} Zeichen gelesen`);
  } catch (err) {
    if (err.name === 'NotFoundError') {
      alert('Die Datei existiert nicht mehr.');
    } else {
      alert(`Datei konnte nicht gelesen werden: ${err.message}`);
    }
  }
};

error nach abort() und im loadend-Handler prüfen

const blob = new Blob(['x'.repeat(10_000_000)], { type: 'text/plain' });
const reader = new FileReader();

reader.onloadend = () => {
  if (reader.error) {
    console.log('Fehler:', reader.error.name);
  } else {
    console.log('Erfolgreich gelesen');
  }
};

console.log('Vorher:', reader.error);
reader.readAsArrayBuffer(blob);
reader.abort();

Vorher: null Fehler: AbortError

// Wichtig · Fallstricke

Nicht mit dem Event verwechseln: Das an onerror übergebene Objekt ist ein ProgressEvent, nicht der Fehler selbst. Die eigentliche Ursache steht in reader.error bzw. event.target.error.
Veralteter Typ: Ältere Browser lieferten statt einer DOMException ein DOMError-Objekt mit numerischem code. Auf error.name zu prüfen ist in allen Browsern zuverlässig.
Zurücksetzen: Beim Start eines neuen Lesevorgangs wird error auf null gesetzt – Fehler also direkt im Handler auswerten bzw. zwischenspeichern.
Die Fehlermeldungen (message) unterscheiden sich je nach Browser und sollten nicht zum Vergleich genutzt werden.
In modernem Code lassen sich Blob.prototype.text() bzw. arrayBuffer() als Promise-basierte Alternative verwenden; Fehler landen dort direkt im catch.
Kompatibilität: in allen aktuellen Browsern sowie in Web Workern verfügbar; Node.js stellt kein FileReader bereit.

Siehe auch

FileReader FileReader.result FileReader.readyState FileReader.prototype.abort() DOMException Blob.prototype.text()