用javascript读取本地文本文件[重复]答案

【问题标题】：Read local text file with javascript [duplicate]用javascript读取本地文本文件[重复]
【发布时间】：2017-06-24 14:31:01
【问题描述】：

我想从我的本地 html 文件中读取一个本地文本文件，因此我尝试遵循此线程 Javascript - read local text file 中的解决方案，但建议的解决方案也不适用于我：

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;
                alert(allText);
            }
        }
    }
    rawFile.send(null);
}

当我调用函数readTextFile("file:///D:/test/text.txt"); 时，firebug 中没有显示任何错误，但也没有显示任何警报。我使用 Windows 和 Firefox 51.0.1（64 位）。我不想将函数FileReader() 与按钮<input type='file' onchange='openFile(event)' ... 结合使用，因为在加载页面时需要自动读取文本文件。那么我怎样才能使上面的解决方案起作用呢？

阅读链接的线程似乎其他人对该解决方案也有问题，尽管该线程被标记为已解决。

【问题讨论】：

一切都保存在我的电脑上。尽管线程被标记为已解决，但阅读其他人也无法解决问题。
为什么不使用 FileReader 和相关的 API？我以前用过，效果很好。
“尽管线程被标记为已解决，但阅读其他人也无法解决问题” – 这不会改变其他讨论的基本结果是：您不能随便读取本地文件，因为那将是一个巨大的安全问题。您需要用户交互才能让他们先选择文件。

标签： javascript

【解决方案1】：

完整的 HTML 和 JavaScript 文件作为读取客户端数据文件的示例。客户端文件只能由 FileReader 访问，指定用户选择的文件。

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript">
                function loadFile(o)
                {
                    var fr = new FileReader();
                    fr.onload = function(e)
                        {
                            showDataFile(e, o);
                        };
                    fr.readAsText(o.files[0]);
                }

                function showDataFile(e, o)
                {
                    document.getElementById("data").innerText = e.target.result;
                }
            </script>

        </script>
    </head>
    <body>
        Select file to read <input type="file" onchange="loadFile(this)">
        <pre id="data"></pre>
    </body>
</html>

【讨论】：

干净又甜美！
我已经为此任务尝试了几种建议的解决方案，但都失败了（可能是我的错）。但这个解决方案第一次对我有用。

【解决方案2】：

作为一般规则，无法从 JavaScript 访问本地文件系统，因此由于浏览器安全性，您的代码示例不应该也不能工作。

但是，File 和 FileReader API 允许您从 <input type="file" /> 读取文件的内容，实际上，这是您处理此类事情的唯一选择 - 您可以使用 @ 987654326@ 访问文件内容。这是获取更多信息的好资源：

https://www.html5rocks.com/en/tutorials/file/dndfiles/

【讨论】：

好的，谢谢您的解释。所以我不明白为什么链接线程的创建者会写“让它在浏览器上工作[..]”。因此使用函数 FileReader() 并定义变量事件并使用 <body onload='openFile(event)'> 也不起作用？
仅供参考如果您的目标是 IE11 以下的任何内容，则 FileReader 对您不可用：caniuse.com/#search=FileReader 没有 SHIM
@Markus - 这是一个老问题，它可能在过去有效，但由于它引入的安全问题而被弃用。您不希望网站能够从您的计算机中“窃取”文件！

【解决方案3】：

解决我的问题最简单的方法是将文本文件更改为.js文件，将其保存在同一文件夹中，并将其包含在<script src="test.js"></script>的html文件中

【讨论】：