在各种浏览器中的javascript中读取客户端的文件内容 [英] Reading file contents on the client-side in javascript in various browsers

问题描述

我试图提供一个仅用于脚本的解决方案，通过浏览器读取客户机上的文件内容。

我有一个解决方案与Firefox和Internet Explorer。这不是很好，但我现在只是在尝试的东西：

$ p $函数getFileContents（）{
var fileForUpload = document.forms [0] .fileForUpload;
var fileName = fileForUpload.value;

if（fileForUpload.files）{
var fileContents = fileForUpload.files.item（0）.getAsBinary（）;
document.forms [0] .fileContents.innerHTML = fileContents;
} else {
//尝试IE方法
var fileContents = ieReadFile（fileName）;
document.forms [0] .fileContents.innerHTML = fileContents;



函数ieReadFile（文件名）
{
尝试
{
var fso = new ActiveXObject（Scripting .FileSystemObject）;
var fh = fso.OpenTextFile（filename，1）;
var contents = fh.ReadAll（）;
fh.Close（）;
返回内容;

catch（例外）
{
return无法打开文件:(;
}
}

我可以调用 getFileContents（），它会把内容写入 fileContents 文本区域。

是否有其他浏览器可以这样做？

我现在最关心Safari和Chrome，但我愿意接受其他浏览器的建议。

<编辑：在回答这个问题时，你为什么要这样做？：

基本上，我想散列文件内容以及客户端的一次性密码，所以我可以将这些信息作为验证信息发回。 解决方案

编辑添加关于File API的信息

由于我最初编写了这个答案， File API 被提议作为一个标准和在大多数浏览器中实现的 （从IE 10开始，它增加了对 FileReader 这里描述的API，但还不是 File API）。 API比旧的Mozilla API复杂一些，因为它被设计为支持异步读取文件，更好地支持二进制文件和解码不同的文本编码。在 Mozilla开发者网络上提供了一些文档以及各种在线示例。你可以这样使用它：

  var file = document.getElementById（fileForUpload）。files [0]; 
 if（file）{
 var reader = new FileReader（）; 
 reader.readAsText（文件，UTF-8）; 
 reader.onload = function（evt）{
 document.getElementById（fileContents）。innerHTML = evt.target.result; 
 
 reader.onerror = function（evt）{
 document.getElementById（fileContents）。innerHTML =读取文件时出错; 
 
 
 
 
 
 原始答案 p> 
 
 
似乎没有办法在WebKit中执行此操作（因此，Safari和Chrome）。  File 对象的唯一键是 fileName 和 fileSize 。根据文件和文件列表支持的提交信息，这些灵感来源于 Mozilla的File对象，但它们似乎只支持一部分功能。
 
 
 
如果您想要更改此设置，您可以随时发送补丁到WebKit项目。另一种可能性是提出将Mozilla API包含在 HTML 5 中;  WHATWG 邮件列表可能是最好的地方。如果你这样做的话，至少在几年的时间内，更有可能用一个跨浏览器的方式来做到这一点。当然，提交修补程序或提案以包含到HTML 5的确意味着一些工作捍卫了这个想法，但Firefox已经实现了它的事实给了你一些开始。
 
I'm attempting to provide a script-only solution for reading the contents of a file on a client machine through a browser.

I have a solution that works with Firefox and Internet Explorer.  It's not pretty, but I'm only trying things at the moment:
function getFileContents() {
    var fileForUpload = document.forms[0].fileForUpload;
    var fileName = fileForUpload.value;

    if (fileForUpload.files) {
        var fileContents = fileForUpload.files.item(0).getAsBinary();
        document.forms[0].fileContents.innerHTML = fileContents;
    } else {
        // try the IE method
        var fileContents = ieReadFile(fileName);
        document.forms[0].fileContents.innerHTML = fileContents;
    }
}       

function ieReadFile(filename) 
{
    try
    {
        var fso  = new ActiveXObject("Scripting.FileSystemObject"); 
        var fh = fso.OpenTextFile(filename, 1); 
        var contents = fh.ReadAll(); 
        fh.Close();
        return contents;
    }
    catch (Exception)
    {
        return "Cannot open file :(";
    }
}
I can call getFileContents() and it will write the contents into the fileContents text area.

Is there a way to do this in other browsers?

I'm most concerned with Safari and Chrome at the moment, but I'm open to suggestions for any other browser.

Edit: In response to the question, "Why do you want to do this?":

Basically, I want to hash the file contents together with a one-time-password on the client side so I can send this information back as a verification.
解决方案
Edited to add information about the File API

Since I originally wrote this answer, the File API has been proposed as a standard and implemented in most browsers (as of IE 10, which added support for FileReader API described here, though not yet the File API). The API is a bit more complicated than the older Mozilla API, as it is designed to support asynchronous reading of files, better support for binary files and decoding of different text encodings. There is some documentation available on the Mozilla Developer Network as well as various examples online. You would use it as follows:
var file = document.getElementById("fileForUpload").files[0];
if (file) {
    var reader = new FileReader();
    reader.readAsText(file, "UTF-8");
    reader.onload = function (evt) {
        document.getElementById("fileContents").innerHTML = evt.target.result;
    }
    reader.onerror = function (evt) {
        document.getElementById("fileContents").innerHTML = "error reading file";
    }
}
Original answer

There does not appear to be a way to do this in WebKit (thus, Safari and Chrome). The only keys that a File object has are fileName and fileSize. According to the commit message for the File and FileList support, these are inspired by Mozilla's File object, but they appear to support only a subset of the features.

If you would like to change this, you could always send a patch to the WebKit project. Another possibility would be to propose the Mozilla API for inclusion in HTML 5; the WHATWG mailing list is probably the best place to do that. If you do that, then it is much more likely that there will be a cross-browser way to do this, at least in a couple years time. Of course, submitting either a patch or a proposal for inclusion to HTML 5 does mean some work defending the idea, but the fact that Firefox already implements it gives you something to start with.

                        
这篇关于在各种浏览器中的javascript中读取客户端的文件内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！