javascript - 简单的 HTML5 放置文件站点网站，用于压缩放置的文件

Question

我想创建一个 HTML5 网站，用户只需删除文件并按下“提交”按钮，一个 javascript 函数会创建一个已删除文件的 .zip 存档。

我的问题是：这是否可能不上传网站中删除的文件，但只能使用保存文件的路径（即“c:\test\droppedfile1.exe”、“c:\test\droppedfile2.exe”）和在本地文件夹中创建 .zip 文件？

Answer 1

虽然您不能直接从 fs 读取文件，但 drop 事件确实允许您读取文件源并（理论上）将内容通过管道传输到Jszip，然后允许用户“下载”zip 文件

这是一个 html5 拖放演示，展示了在无法访问客户端路径或将文件上传到服务器的情况下读取图像文件

Answer 2

No, it's not in plain HTML/JS. HTML/JS have no access to your hard drive. In fact, when you use a file upload box, the value is set to C:/fakepath/nameoffile.ext (where nameoffile.ext is the file name on the disk).

If you drag-drop or copy-paste files, they become blobs. In this case, the original file path is completely mangled -- it becomes something like blob://lots-and-lots-of-gibberish.

So no, HTML/JS do not provide you any way to get the file paths from an upload or upload from a provided file path.

---

However, on Chrome, there is the HTML5 filesystem API, which will probably help. Here's a tutorial on it.

Note that this will require extra permissions and won't work on other browsers just yet.

---

Using the File API, you can read the data in selected files. You cannot get their paths, but you can read the data in a file selected in an upload box (or a drag dropped file), and use your JS function to zip the files.