Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from http://developer.mozilla.org/de/docs/Web/API/FileReader below:

FileReader - Web-APIs | MDN

Baseline Widely available

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Das FileReader-Interface ermöglicht Webanwendungen, den Inhalt von Dateien (oder rohen Datenpuffern), die auf dem Computer des Nutzers gespeichert sind, asynchron zu lesen. Dabei werden File- oder Blob-Objekte verwendet, um die zu lesende Datei oder Daten anzugeben.

Dateiobjekte können von einem FileList-Objekt erhalten werden, das als Ergebnis der Auswahl von Dateien durch den Nutzer mit dem <input type="file">-Element oder durch das DataTransfer-Objekt einer Drag-and-Drop-Operation zurückgegeben wird. FileReader kann nur auf den Inhalt von Dateien zugreifen, die der Nutzer explizit ausgewählt hat; es kann nicht verwendet werden, um eine Datei anhand des Pfades aus dem Dateisystem des Nutzers zu lesen. Um Dateien auf dem Dateisystem des Clients nach Pfad zu lesen, verwenden Sie die File System Access API. Um serverseitige Dateien zu lesen, verwenden Sie fetch() mit CORS-Berechtigung, wenn Sie domänenübergreifend lesen.

FileReader()

Gibt ein neues FileReader-Objekt zurück.

Siehe Verwendung von Dateien aus Webanwendungen für Details und Beispiele.

FileReader.error Schreibgeschützt

Ein DOMException, das den Fehler darstellt, der beim Lesen der Datei aufgetreten ist.

FileReader.readyState Schreibgeschützt

Eine Zahl, die den Zustand des FileReader angibt. Dies ist einer der folgenden:

Name Wert Beschreibung EMPTY 0 Es wurden noch keine Daten geladen. LOADING 1 Daten werden derzeit geladen. DONE 2 Der gesamte Lesevorgang wurde abgeschlossen.

FileReader.result Schreibgeschützt

Der Inhalt der Datei. Diese Eigenschaft ist nur gültig, nachdem der Lesevorgang abgeschlossen ist, und das Format der Daten hängt von der Methode ab, die verwendet wurde, um den Lesevorgang zu starten.

FileReader.abort()

Bricht den Lesevorgang ab. Nach der Rückkehr wird der readyState DONE sein.

FileReader.readAsArrayBuffer()

Beginnt mit dem Lesen des Inhalts des angegebenen Blob. Sobald der Vorgang abgeschlossen ist, enthält das result-Attribut einen ArrayBuffer, das die Daten der Datei darstellt.

FileReader.readAsBinaryString() Veraltet

Beginnt mit dem Lesen des Inhalts des angegebenen Blob. Sobald der Vorgang abgeschlossen ist, enthält das result-Attribut die rohen binären Daten der Datei als String.

FileReader.readAsDataURL()

Beginnt mit dem Lesen des Inhalts des angegebenen Blob. Sobald der Vorgang abgeschlossen ist, enthält das result-Attribut eine data:-URL, die die Daten der Datei darstellt.

FileReader.readAsText()

Beginnt mit dem Lesen des Inhalts des angegebenen Blob. Sobald der Vorgang abgeschlossen ist, enthält das result-Attribut den Inhalt der Datei als Textstring. Ein optionaler Codierungsname kann angegeben werden.

Hören Sie auf diese Ereignisse mit addEventListener() oder indem Sie einen Ereignis-Listener auf die oneventname-Eigenschaft dieses Interfaces setzen. Entfernen Sie die Ereignis-Listener mit removeEventListener(), sobald FileReader nicht mehr verwendet wird, um Speicherlecks zu vermeiden.

abort

Wird ausgelöst, wenn ein Lesevorgang abgebrochen wurde, weil beispielsweise das Programm FileReader.abort() aufgerufen hat.

error

Wird ausgelöst, wenn der Lesevorgang aufgrund eines Fehlers fehlgeschlagen ist.

load

Wird ausgelöst, wenn ein Lesevorgang erfolgreich abgeschlossen wurde.

loadend

Wird ausgelöst, wenn ein Lesevorgang abgeschlossen ist, unabhängig davon, ob er erfolgreich war oder nicht.

loadstart

Wird ausgelöst, wenn ein Lesevorgang gestartet wurde.

progress

Wird periodisch ausgelöst, während Daten gelesen werden.

Dieses Beispiel liest und zeigt den Inhalt einer Textdatei direkt im Browser an.

<h1>File Reader</h1>
<input type="file" id="file-input" />
<div id="message"></div>
<pre id="file-content"></pre>

const fileInput = document.getElementById("file-input");
const fileContentDisplay = document.getElementById("file-content");
const messageDisplay = document.getElementById("message");

fileInput.addEventListener("change", handleFileSelection);

function handleFileSelection(event) {
  const file = event.target.files[0];
  fileContentDisplay.textContent = ""; // Clear previous file content
  messageDisplay.textContent = ""; // Clear previous messages

  // Validate file existence and type
  if (!file) {
    showMessage("No file selected. Please choose a file.", "error");
    return;
  }

  if (!file.type.startsWith("text")) {
    showMessage("Unsupported file type. Please select a text file.", "error");
    return;
  }

  // Read the file
  const reader = new FileReader();
  reader.onload = () => {
    fileContentDisplay.textContent = reader.result;
  };
  reader.onerror = () => {
    showMessage("Error reading the file. Please try again.", "error");
  };
  reader.readAsText(file);
}

// Displays a message to the user
function showMessage(message, type) {
  messageDisplay.textContent = message;
  messageDisplay.style.color = type === "error" ? "red" : "green";
}

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4