Question

我看过一些关于网页访问客户端计算机上文件的帖子，即question。

我正在尝试为我正在编写的一些算法跳转“在云中不断更新”范例，以便我的用户只需访问网页即可访问最新版本。这要求程序/网页可以从目录开始，并递归地检查其中的文件，并根据找到的内容计算结果。最后，它还应该能够将结果文件写入客户端的文件系统。

上一个问题中的一个答案提到了Google Gears，但此后已停止使用HTML5。是否可以在HTML5中访问客户端目录？怎么样？

我知道为什么任何网页访问本地文件都存在安全风险，但出于我的目的，我可以向用户询问相应的权限。

Answer 1

不，至少不是直接的。但是，你有很多选择。

目前您最好的选择是：

从桌面拖放文件，请参阅a tutorial。
使用输入类型文件。
- 使用File API阅读内容或提交表单。阅读Mozilla Developer Center关于动态阅读文件的更多信息。
- 您可以指定multiple属性一次读取和打开多个文件，而无需单独的字段。
- 您可以拥有一个不可见的输入并在其上“触发点击”以打开文件打开对话框。有关详细信息，请参阅之前的Mozilla开发人员中心链接。
使用FileSystem API可以创建，删除，读取，修改文件系统上的文件。注意：您将获得一个沙盒目录，您无法像这样访问整个系统。
使用带signed applets的Java访问整个文件系统。这要求用户接受签名。

Answer 2

Chrome 6也将支持File API

Answer 3

如前所述，FileSystem和File API以及FileWriter API可用于从浏览器标签/窗口的上下文读取和写入文件到客户机。

有几个与FileSystem和FileWriter API有关的事情，你应该知道，其中一些被提到，但值得重复：

API的实现目前仅存在于基于Chromium的浏览器（Chrome＆amp; Opera）
这两个API于2014年4月24日从W3C标准轨道中删除，截至目前为专有
将来可能会从实现浏览器中删除（现在专有的）API
沙箱（磁盘上的文件无法生效的位置）用于存储使用API创建的文件
使用虚拟文件系统（一种不一定存在于磁盘上的目录结构，其形式与在浏览器中访问时相同）代表使用API创建的文件

这里有一些简单的例子，说明如何直接和间接地使用API来做这些事情：

<强> BakedGoods *

写文件：

bakedGoods.set({
    data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}],
    storageTypes: ["fileSystem"],
    options: {fileSystem:{storageType: Window.PERSISTENT}},
    complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});

读取文件：

bakedGoods.get({
        data: ["testFile"],
        storageTypes: ["fileSystem"],
        options: {fileSystem:{storageType: Window.PERSISTENT}},
        complete: function(resultDataObj, byStorageTypeErrorObj){}
});

使用原始文件，FileWriter和FileSystem API

写文件：

function onQuotaRequestSuccess(grantedQuota)
{

    function saveFile(directoryEntry)
    {

        function createFileWriter(fileEntry)
        {

            function write(fileWriter)
            {
                var dataBlob = new Blob(["Hello world!"], {type: "text/plain"});
                fileWriter.write(dataBlob);              
            }

            fileEntry.createWriter(write);
        }

        directoryEntry.getFile(
            "testFile", 
            {create: true, exclusive: true},
            createFileWriter
        );
    }

    requestFileSystem(Window.PERSISTENT, grantedQuota, saveFile);
}

var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);

读取文件：

function onQuotaRequestSuccess(grantedQuota)
{

    function getfile(directoryEntry)
    {

        function readFile(fileEntry)
        {

            function read(file)
            {
                var fileReader = new FileReader();

                fileReader.onload = function(){var fileData = fileReader.result};
                fileReader.readAsText(file);             
            }

            fileEntry.file(read);
        }

        directoryEntry.getFile(
            "testFile", 
            {create: false},
            readFile
        );
    }

    requestFileSystem(Window.PERSISTENT, grantedQuota, getFile);
}

var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);

鉴于FileSystem和FileWriter API的当前状态，它们对读取和写入文件的利用率目前不构成＆＃34; HTML5方式＆＃34;做那些事。

然而，对未实现的浏览器供应商的API的重新关注可能会使他们重新回到标准轨道上。结合基于Chromium的浏览器的高市场渗透率以及谷歌（Chromium的主要贡献者）没有给出API的终止日期这一事实应该足以证明它们在某些情况下的使用是合理的。

* BakedGoods由这个人维持在这里：）

HTML5是否允许您从浏览器中与本地客户端文件进行交互

3 个答案: