背景：
我想制作一个仅使用 JavaScript/HTML并且可以由浏览器直接从文件系统打开的“应用程序”。此应用程序必须能够从另一个文件中读取数据。然后，我将使用 JS 对其进行解析并呈现页面。作为一个简化的示例，假设我有一个 CSV 文件（在此处下载）：
Mark Rodgers,mark.rodgers@company.com,Accounting
[...]
Melissa Jones,melissa@company.com,CEO
我希望能够使用 JS 读取文件并使用其中的数据来生成我的页面。
到目前为止我已经完成了什么：
演示（右键单击->“另存为”将 HTML 保存到您的计算机）。它也可以在jsfiddle上以半损坏的方式使用（布局已损坏，但在功能上应该仍然正确）。
只需将 CSV 文本文件拖放到拖放框中，或使用文件菜单选择文本文件，JavaScript 就会读取、解析文件并填充表格。
这依赖于 FileReader API；大部分繁重的工作都是由这个函数完成的：
function handleFileSelect(evt) {
evt.stopPropagation();
evt.preventDefault();
var files = evt.target.files || evt.dataTransfer.files; // FileList object.
var file = files[0];
// this creates the FileReader and reads stuff as text
var fr = new FileReader();
fr.onload = parse;
fr.readAsText(file);
// this is the function that actually parses the file
// and populates the table
function parse()
{
var table = document.getElementById('emps');
var employees = fr.result.split('\n'); var c = 0;
for (var i in employees)
{
var employee = employees[i].split(',');
if (employee.length == 3)
{
var row = document.createElement('tr');
row.innerHTML = "<td>" + employee.join("</td><td>") + "</td>";
table.appendChild(row);
c++;
}
}
document.getElementById('result').innerHTML = '<span>Added ' + c + ' employees from file: ' + file.name + '</span>';
}
}
这几乎没问题，但它给用户手动加载文件带来了不便。理想情况下，它应该能够自动加载它，但出于安全原因，没有浏览器允许这样做......但是。
解决方案要求：
必须离线工作；即：它不能依赖任何在线服务。这也包括在本地机器上运行的 HTTP 服务器。我们的想法是让它在任何只安装了浏览器的计算机上运行。
必须在使用
file:///协议打开页面时工作（即：硬盘驱动器上的 HTML 页面）。不应依赖第三方插件（例如：Flash、Java、颤抖的ActiveX）。我很确定如果页面在，这些可能无论如何都不起作用
file:///它必须能够接受任意数据。这排除了以行为良好的格式加载文件，该格式可以像 JSON 一样可供使用。
如果它适用于 Firefox 或 Chrome 中的任何一个（理想情况下两者都适用），那就没问题了。依赖实验性 API 也是可以的
我事先知道文件名是什么，所以它可以在 HTML 本身中编码。任何使我能够从磁盘读取文件的解决方案都可以，它不必使用 FileReader API。
因此，如果有一个聪明的技巧可以将文件加载到一个页面中也很好（也许将它加载到一个不可见的 iframe 并让 JS 检索内容）；那也没关系。