Wie kann ich eine lokale Textdatei in einem Webbrowser lesen?

So lesen Sie eine lokale Textdatei im Browser

Beim Versuch, einen einfachen Textdateileser mit XMLHttpRequest zu implementieren, funktioniert dieser möglicherweise nicht richtig. In diesem Artikel werden potenzielle Probleme untersucht und Lösungen zu deren Behebung bereitgestellt.

XMLHttpRequest-Ausnahme 101

Wenn eine XMLHttpRequest-Anfrage mit einem lokalen Dateipfad gestellt wird, kann dies zu einer Ausnahme 101 führen. Dies geschieht, weil Moderne Browser schränken den direkten Zugriff auf das Dateisystem streng ein. Um dies zu umgehen, vermeiden Sie die Verwendung von file:///-Pfaden.

Fetch API (Alternative zu XMLHttpRequest)

Ein modernerer und benutzerfreundlicherer Ansatz zum Abrufen von Daten aus URLs ist die Fetch API. eingeführt in JS. Der folgende Code demonstriert seine Verwendung:

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

XMLHttpRequest-Konfiguration für lokale Dateien

Für lokale Dateianforderungen mit XMLHttpRequest ist es notwendig, sowohl den Status 0 als auch 200 zu überprüfen, da der Status nicht von zurückgegeben wird ein Webserver:

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) {
        var allText = rawFile.responseText;
        console.log(allText);
       }
    }
  }
  rawFile.send(null);
}

Datei angeben Pfad

Bei der Verwendung von XMLHttpRequest mit lokalen Dateien ist es zwingend erforderlich, das Protokoll „file://“ im Dateinamen anzugeben:

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

Das obige ist der detaillierte Inhalt vonWie kann ich eine lokale Textdatei in einem Webbrowser lesen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!