7

我正在为网站原型工作（仅基于浏览器）。有一部分我需要上传一些文件。这里我使用的是 JavaScript 和 HTML。

每当用户想要上传（如应用程序中的“浏览”按钮）一些文件时，它将可供下次使用。我无法做到这一点。

问题我们可以仅在浏览器中使用 JavaScript/HTML 保存/存储/上传文件（不是服务器）吗？

谢谢

4

3 回答 3

5

将文件直接下载到用户的文件系统

如果您通过保存/存储直接到用户的计算机/文件系统，那么不，由于安全原因，这是不可能的。

但是，您可以启动下载，该下载将弹出“另存为”类型的请求者，并允许用户接受或拒绝下载文件。

启动下载的方法不止一种。一个有趣的是锚标记的新download 属性，您可以在其中指定文件名以及自动启动下载，将其设置href为data-uri或您想要参考下载的其他内容：

<a href="urlToFile" download="myFile.ext">Click to download</a>

本地存储机制

如果您只是想在本地保存文件，您可以使用许多本地存储机制之一，例如：

请注意，所有这些都是沙盒的，并且只能在浏览器中使用，它们的来源与它们的写入来源相同。数据可能会或可能不会在任何时候被丢弃（由用户或浏览器），因此它们不是“安全”存储（始终保留服务器副本或重新生成数据的方式）。

于 2013-10-10T11:45:01.057 回答
2

是的，可以通过FileSystem API（目前只有 Chrome 和 Opera）。

window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;

document.querySelector('input[type="file"]').onchange = function(e) {
  var files = this.files;

  window.requestFileSystem(window.TEMPORARY, 1024*1024, function(fs) {
    // Duplicate each file the user selected to the app's fs.
    for (var i = 0, file; file = files[i]; ++i) {

      // Capture current iteration's file in local scope for the getFile() callback.
      (function(f) {
        fs.root.getFile(f.name, {create: true, exclusive: true}, function(fileEntry) {
          fileEntry.createWriter(function(fileWriter) {
            fileWriter.write(f); // Note: write() can take a File or Blob object.
          }, errorHandler);
        }, errorHandler);
      })(file);

    }
  }, errorHandler);

};
于 2013-10-10T11:45:15.087 回答
-3

“我们可以仅在浏览器（不是服务器）中使用 JavaScript/HTML 保存/存储/上传文件吗？？”

答。是否。_ 如果要保留上传的文件，则需要将其存储在服务器上。

关闭浏览器选项卡的那一刻，文件将丢失。

替代方案：您可以做的是将文件名存储在服务器上，每当用户请求文件时，请他上传文件。

要将文件上传到内存中，您可以参考此链接。

现场演示

于 2013-10-10T11:43:01.390 回答