如何用Javascript打开本地磁盘文件？

Question

我试图打开文件，

window.open("file:///D:/Hello.txt"); 

的浏览器不支持打开本地文件这种方式，可能出于安全原因。我想在客户端使用文件的数据。我怎样才能读取Javascript中的本地文件？

Answer 1

你不能。像Firefox，Safari等新浏览器会阻止'文件'协议。它只适用于旧版浏览器。

你必须上传你想要的文件。

Answer 2

HTML5 fileReader facility确实允许您处理本地文件，但这些文件必须由用户选择，您不能追根究底寻找文件的用户磁盘。

我目前在Chrome（6.x）的开发版本中使用它。我不知道其他浏览器支持它。

Answer 3

JavaScript通常不能访问新浏览器中的本地文件，但XMLHttpRequest对象可用于读取文件。所以它实际上是读取文件的Ajax（而不是Javascript）。

如果要读取的文件abc.txt，您可以编写代码：

var txt = ''; 
var xmlhttp = new XMLHttpRequest(); 
xmlhttp.onreadystatechange = function(){ 
    if(xmlhttp.status == 200 && xmlhttp.readyState == 4){ 
    txt = xmlhttp.responseText; 
    } 
}; 
xmlhttp.open("GET","abc.txt",true); 
xmlhttp.send(); 

现在txt包含文件的abc.txt的内容。

Answer 4

xmlhttp请求方法对本地磁盘上的文件无效，因为浏览器安全性不允许我们这样做。但是我们可以通过创建快捷方式 - >右键单击 - >属性来覆盖浏览器安全性在目标“ ...浏览器位置path.exe“append - 允许从文件访问文件。这是在Chrome上测试的，但应注意所有浏览器窗口应该关闭，代码应该从打开的浏览器运行通过这个捷径。

Answer 5

下面是使用FileReader一个例子：

function readSingleFile(e) { 
 
    var file = e.target.files[0]; 
 
    if (!file) { 
 
    return; 
 
    } 
 
    var reader = new FileReader(); 
 
    reader.onload = function(e) { 
 
    var contents = e.target.result; 
 
    displayContents(contents); 
 
    }; 
 
    reader.readAsText(file); 
 
} 
 

 
function displayContents(contents) { 
 
    var element = document.getElementById('file-content'); 
 
    element.textContent = contents; 
 
} 
 

 
document.getElementById('file-input') 
 
    .addEventListener('change', readSingleFile, false);

<input type="file" id="file-input" /> 
 
<h3>Contents of the file:</h3> 
 
<pre id="file-content"></pre>

---

规格

http://dev.w3.org/2006/webapi/FileAPI/

浏览器兼容性

• IE 10+
• 的Firefox 3.6+
• 铬13+
• 的Safari 6.1+

http://caniuse.com/#feat=fileapi