我如何允许用户将文件上传到我的网站，编辑并保存回

How do I allow the user to upload file to my site, edit it and save it back

本文关键字：网站 我的 编辑 保存 何允许 用户 文件      更新时间：2023-09-26

我正在构建一个非常简单的web应用程序。没有php，只有html&javascript。

我想为来到我的网站的用户获得这个用例：

  1. 用户将从他/她的计算机中选择一个文本文件，例如：c:''directory''file.txt
  2. 他会在我的网页中打开这个文件（我必须使用php吗？将文件上传到服务器，然后在我的网站上显示？如果我不想在我的服务器中保存数据-只是为了让用户编辑它-我可以在客户端用js做所有这些操作吗？）
  3. 他将编辑一些文本
  4. 他会按下一个名为"保存"或"另存为"的按钮，它会自动将他的文件保存在他的电脑中

由于我对文件管理一无所知，我很乐意从哪里得到关于管理该文件的js库或有关该库的一般信息的建议。

谢谢，Alon

p.s在网上搜索"上传文件"给了我很多关于如何将文件上传到ftp的结果——我的问题不在于此。

您想要的通常需要php等服务器端代码。

话虽如此，有一些方法可以只使用JavaScript来实现这一点。该代码在很大程度上是特定于浏览器的，并在保存时生成安全警告（，因为让JavaScript使用这样的资源通常是不安全的）。具体来说，我记得TiddlyWiki，它只使用JavaScript和HTML。看看这样一个TiddlyWiki文件中的代码，里面有这样的代码：

// Returns null if it can't do it, false if there's an error, true if it saved OK
function mozillaSaveFile(filePath,content)
{
    if(window.Components) {
        try {
            netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
            var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
            file.initWithPath(filePath);
            if(!file.exists())
                file.create(0,0x01B4);// 0x01B4 = 0664
            var out = Components.classes["@mozilla.org/network/file-output-stream;1"].createInstance(Components.interfaces.nsIFileOutputStream);
            out.init(file,0x22,0x04,null);
            out.write(content,content.length);
            out.flush();
            out.close();
            return true;
        } catch(ex) {
            return false;
        }
    }
    return null;
}

作为替代方案，根据您需要支持的浏览器，您可以查看HTML5的本地存储功能。

相关文章：