如何在瀏覽器中讀取本機文字檔案？

如何在瀏覽器中讀取本機文字檔案

嘗試使用 XMLHttpRequest 實作簡單的文字檔案讀取器時，它可能無法正常運作。本文探討了潛在問題並提供了糾正這些問題的解決方案。

XMLHttpRequest 異常 101

使用本機檔案路徑發出 XMLHttpRequest 要求時，可能會導致異常 101。發生這種情況的原因是現代瀏覽器嚴格限制直接檔案系統存取。若要避免這種情況，請避免使用 file:/// 路徑。

Fetch API（XMLHttpRequest 的替代方案）

從 URL 檢索資料的更現代且用戶友好的方法是 Fetch API， JS中介紹的。下面的程式碼示範了它的用法：

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

本機檔案的 XMLHttpRequest 設定

對於使用 XMLHttpRequest 的本機檔案請求，需要檢查狀態 0 和 200，因為狀態不是從Web伺服器：

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);
}

指定檔案路徑

使用時帶有本機檔案的 XMLHttpRequest，必須在檔案名稱中指定 file:// 協定：

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

以上是如何在瀏覽器中讀取本機文字檔案？的詳細內容。更多資訊請關注PHP中文網其他相關文章！