要将本地文本文件读入浏览器，开发人员传统上使用 XMLHttpRequest。实现此目的的一种方法是通过一个函数，该函数获取文件的路径并将每行文本转换为字符数组：
function readTextFile() {
var rawFile = new XMLHttpRequest();
rawFile.open("GET", "testing.txt", true);
rawFile.onreadystatechange = function() {
if (rawFile.readyState === 4) {
var allText = rawFile.responseText;
document.getElementById("textSection").innerHTML = allText;
}
}
rawFile.send();
}但是，这种方法通常会失败，在 Firefox 以外的浏览器中会出现异常。为了解决这个问题，开发人员应该使用 JS 2015 中引入的 Fetch API：
fetch("myText.txt")
.then((res) => res.text())
.then((text) => {
// do something with "text"
})
.catch((e) => console.error(e));此外，出于安全原因，避免使用 file:/// 至关重要。相反，请考虑使用轻量级 Web 服务器（例如 Python 的 http.server 或 HTTP-Server）来加载数据。
尝试使用 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);
}
readTextFile("file:///C:/your/path/to/file.txt");以上是如何可靠地将本地文本文件读取到Web浏览器中？的详细内容。更多信息请关注PHP中文网其他相关文章！
