ブラウザでローカル テキスト ファイルを読むにはどうすればよいですか?

ブラウザでローカル テキスト ファイルを読み取る方法

ブラウザでローカル テキスト ファイルを読み取る際に課題が発生しています。これに対処するには、次の点を考慮してください。

1. Fetch API の組み込み

Fetch API の導入により、XMLHttpRequest メソッドに代わる、URL からデータを取得するための合理化されたアプローチが提供されます。次のように実装します。

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

2. file:///

は避けてください。最新のブラウザでは、ファイルシステムへの直接アクセスが厳しく制限されています。これを回避するには、file:/// プレフィックスの使用を避けます。

3.ローカル テストに Web サーバーを使用する

file:/// に依存する代わりに、次のような軽量 Web サーバーを使用します。

• python -m http.server

これにより、標準の HTTP URL を使用してデータにアクセスできるようになり、アクセスが軽減されます。

元の解決策

XMLHttpRequest の問題を処理するには、次の手順を実行します:

• ローカル ファイルをロードするときにステータス 0 を確認します。

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

• ファイルに file:// を指定しますファイルパス。

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

以上がブラウザでローカル テキスト ファイルを読むにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。