Warum kann mein JavaScript-Code lokale Textdateien nicht lesen und wie kann ich das Problem beheben?

Fehlerbehebung beim Lesen lokaler Textdateien im Browser

In einem Versuch, einen einfachen Textdateireader zu erstellen, wurde eine JavaScript-Funktion entwickelt In einem Dateipfad wurde jede Zeile in ein Zeichenarray analysiert, es sind jedoch Fehler aufgetreten. Ziel dieses Artikels ist es, diese Probleme zu diagnostizieren und zu beheben.

Fehlerdiagnose

Der Code konnte den Textinhalt zunächst nicht anzeigen, obwohl der Pfad der Datei erfolgreich abgerufen werden konnte. Beim Debuggen wurde festgestellt, dass das XMLHttpRequest-Objekt den lokalen Dateizugriff nicht korrekt verarbeitete.

Der Wechsel zu Firefox führte zu erfolgreichen Ergebnissen und wies auf ein potenzielles browserspezifisches Problem hin. Insbesondere Chrome hat eine XMLHttpRequest-Ausnahme 101 ausgelöst, die auf einen Netzwerkfehler hinweist.

Lösung für die Browserkompatibilität

Um das Browserkompatibilitätsproblem zu beheben, hat die Fetch-API, wurde 2015 in JS eingeführt und bietet einen einfacheren und robusteren Ansatz zum Abrufen von Daten aus URLs. Hier ist eine aktualisierte Version des Codes:

fetch("myText.txt")
  .then((res) => res.text())
  .then((text) => {
    // process the text content
  })
  .catch((e) => console.error(e));

Zugriff auf lokale Dateien

Moderne Browser schränken den direkten Dateisystemzugriff stark ein, daher sollte die Verwendung von file:/// vermieden werden . Stattdessen können einfache Webserver wie python -m http.server oder npx http-server verwendet werden, um Daten über Standard-HTTP-URLs zu laden.

Verarbeitungsstatus 0

Wann Beim Zugriff auf lokale Dateien mit XMLHttpRequest wird kein Status zurückgegeben. Um dieses Problem zu beheben, ist eine Prüfung auf Status 0 erforderlich:

function readTextFile(file) {
  var rawFile = new XMLHttpRequest();
  rawFile.open("GET", file, false);
  rawFile.onreadystatechange = function () {
    if (rawFile.readyState === 4) {
      if (rawFile.status === 200 || rawFile.status == 0) {
        // process the text content
      }
    }
  };
  rawFile.send(null);
}

Beispielverwendung

Um den aktualisierten Code zu verwenden, geben Sie den Dateipfad mit file:// an. /:

readTextFile("file:///C:/your/path/to/file.txt");

Das obige ist der detaillierte Inhalt vonWarum kann mein JavaScript-Code lokale Textdateien nicht lesen und wie kann ich das Problem beheben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!