当前位置:  开发笔记 > 编程语言 > 正文

使用javascript进行本地文件访问

如何解决《使用javascript进行本地文件访问》经验,为你挑选了7个好方法。

是否有使用JavaScript完成的本地文件操作?我正在寻找一种可以在没有安装空间的情况下完成的解决方案,例如需要AIR.

具体来说,我想从文件中读取内容并将这些内容写入另一个文件.在这一点上,我并不担心获得权限,只是假设我已经拥有这些文件的完全权限.



1> Horst Walter..:

只是对HTML5功能的更新http://www.html5rocks.com/en/tutorials/file/dndfiles/这篇优秀的文章将详细解释Javascript中的本地文件访问.上述文章摘要:

规范提供了几个用于从"本地"文件系统访问文件的接口:

    文件 - 单个文件; 提供只读信息,例如名称,文件大小,mimetype和对文件句柄的引用.

    FileList - 类似于数组的File对象序列.(在桌面上思考或拖动文件目录).

    Blob - 允许将文件切片为字节范围.

- 编辑 -

请参阅下面的Paul D. Waite的评论


看起来这些API被放弃了:请参阅http://www.w3.org/TR/file-writer-api/和http://www.html5rocks.com/en/tutorials/file/filesystem/
它不像我们使用Java或Flash插件那样真正的文件系统.例如,除非他自己首先选择文件,否则我们无法在用户的桌面上列出文件.
考虑到W3C用于抢夺有用技术的形式,请小心.仅在chrome中实现的文件系统api不会继续._file_ api,[具有通用](http://caniuse.com/#search=file)支持,被接受为[w3c工作草案](http://www.w3.org/TR/FileAPI/)和我们再也无法想象没有它的生活.当然我们仍然在浏览器中,我们必须等到用户将文件带到我们这里,但这会大大扩展Web应用程序的范围,并且不会很快消失.

2> Chase Seiber..:

如果用户选择文件,您可以使用File API 读取和处理该文件.

设计不允许读取或写入任意文件.这违反了沙箱.来自维基百科 - > Javascript - >安全性:

JavaScript和DOM为恶意作者提供了通过Web在客户端计算机上运行脚本的潜力.浏览器作者使用两个限制包含此风险.首先,脚本在沙箱中运行,在沙箱中,脚本只能执行与Web相关的操作,而不能执行创建文件等通用编程任务 .

2016 UPDATE:直接访问文件系统经由能够文件系统API,这是仅由铬和歌剧支持和可能最终没有被实现为通过其他浏览器(与边缘的例外).有关详细信息,请参阅Kevin的回答.


这个答案可能在3年前是正确的,但它肯定不再正确.请参阅@Horst Walter对HTML5的回答.或者到这里:http://www.html5rocks.com/en/tutorials/file/dndfiles/
该死的.当然,这是愚蠢的.Javascript应该是一种与应用程序无关的脚本语言.并非每个应用程序都是Web浏览器.我来到这里是因为我对Photoshop脚本感兴趣.即使某些应用程序不提供文件访问类,也可以将它们标准化为适合的应用程序 - 标准但可选的功能,因此即使不是普遍适用,一个应用程序的体验也是可转换的.我在Photoshop中学到的东西甚至不能移植到允许文件访问的其他Javascript主机.
Javascript语言,并执行托管环境允许它做的任何事情.SpiderMonkey可以做任何其他语言都可以做的事情.**浏览器**中的Javascript是沙箱.

3> Jason S..:

更新自Firefox 17以来,此功能已被删除(请参阅https://bugzilla.mozilla.org/show_bug.cgi?id=546848).


在Firefox上,您(程序员)可以在JavaScript文件中执行此操作:

netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");

并且将提示您(浏览器用户)允许访问.(对于Firefox,每次启动浏览器时都需要执行一次)

如果浏览器用户是其他人,则必须授予权限.


这会给出一个不推荐使用的错误,您只能在扩展名中执行此操作,而不能在网站javascript中执行此操作
如此链接所示,此功能已在以后的firefox版本中删除.http://support.mozilla.org/en-US/questions/944433
哦,太糟糕了.我得到了安全性和所有这些,但我们需要一种授予信任的方式来在本地运行我们自己的javascript文件.
请更新答案以表明已弃用.谢谢.

4> Kevin..:

如前所述,FileSystem和File API以及FileWriter API可用于从浏览器选项卡/窗口的上下文读取和写入文件到客户端计算机.

有一些与FileSystem和FileWriter API有关的事情你应该知道,其中一些已被提及,但值得重复:

API的实现目前仅存在于基于Chromium的浏览器(Chrome和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不再符合标准,但在我看来,在某些情况下,它们的使用是合理的,因为:

来自未实现的浏览器供应商的更新兴趣可能会将它们重新置于其上

实施(基于Chromium)浏览器的市场渗透率很高

谷歌(Chromium的主要贡献者)尚未给出API的生命终止日期

但是,"某些情况"是否包含您自己的情况,由您决定.

*BakedGoods由这个人维持正确:)



5> Jaredcheeda..:

NW.js允许您使用Javascript创建桌面应用程序,而不会通常在浏览器上放置所有安全限制.因此,您可以使用函数运行可执行文件,或创建/编辑/读取/写入/删除文件.您可以访问硬件,例如当前CPU使用率或正在使用的总RAM等.

您可以使用它创建一个不需要任何安装的Windows,Linux或Mac桌面应用程序.

http://nwjs.io

这是通用GUI的NW.js的框架:

http://ugui.io



6> 小智..:

如果您在Windows上进行部署,则Windows脚本宿主会为文件系统和其他本地资源提供非常有用的JScript API.但是,将WSH脚本合并到本地Web应用程序可能并不像您希望的那样优雅.


我希望解决方案是os独立的(至少在windows和mac之间),所以windows脚本主机不满足它,除非有一个类似的mac平台解决方案

7> Radek Mezulá..:

如果您有输入栏


您可以使用BLOB格式获取文件内容:

function add(event){
  var userFile = document.getElementById('file');
  userFile.src = URL.createObjectURL(event.target.files[0]);
  var data = userFile.src;
}

推荐阅读
爱唱歌的郭少文_
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有