jQuery文件上传插件：是否可以保留上传文件夹的结构？ [英] jQuery File Upload Plugin: Is possible to preserve the structure of uploaded folders?

问题描述

我正在尝试这个插件（ https://github.com/blueimp/jQuery-File-

I am trying this plugin (https://github.com/blueimp/jQuery-File-Upload) and interesting in folder upload.

我想知道插件是否能够保留上传的子文件夹的结构（=上传1个文件夹3个子文件夹，每个包含几个文件）？

I wonder if the plugin is able to preserve the structure of uploaded subfolders (= uploading 1 folder with 3 subfolder, each containing several files)?

推荐答案

应该可以在 webkit 浏览器使用拖放 .dataTransfer 对象在 drop 事件; .webkitGetAsEntry（）; webkitRequestFileSystem getDirectory（）创建与上传文件夹具有相同名称的目录， .createReader（） DirectoryEntry ， readEntries（）在目录中迭代条目，调用 .copyTo（）为每个 FileEntry ，目标正在创建目录，具有上传的目录名称。

This should be possible at webkit browsers using drag-and-drop .dataTransfer object at drop event; .webkitGetAsEntry(); webkitRequestFileSystem getDirectory() to create directory having same name as uploaded folder, .createReader() on DirectoryEntry , readEntries() to iterate entries in directory, call .copyTo() for each FileEntry with destination being created directory having uploaded directory name.

该文件夹现在可以使用 webkitRequestFileSystem（），然后调用 .getDirectory（）与目录名称作为第一个参数，空选项对象 {} 作为第二个参数。

The folder should now be accesible using either webkitRequestFileSystem() , then calling .getDirectory() with directory name as first parameter and empty options object {} as second parameter.

或者，可以使用文件管理器gui或命令行界面从chrome或chrome配置文件夹的实际用户文件系统访问文件夹。
或者，创建本地脚本将文件系统中的文件夹复制到另一个目录，并将文件夹重命名为已上传的文件夹的原始名称。文件夹和文件路径不被调整，只有文件夹名称。

Alternatively, can access folder from actual user filesystem at chrome or chromium profile folder using file manager gui or command line interface. Or, create a local script to copy folders in File System to another directory, and rename folders to original names of folders that were uploaded. The folder and file paths are not adjusted, only the folder names.

可以保留上传子文件夹的结构（=上传
1个文件夹，包含3个子文件夹，每个文件夹包含几个文件）？

is able to preserve the structure of uploaded subfolders (= uploading 1 folder with 3 subfolder, each containing several files)?

在文件管理器中，文件夹的命名与上传目录，虽然应该保留文件夹和文件结构。该文件夹应位于chrome profile文件夹 Origins 文件夹之前的文件系统中的最后一个文件夹。另请参阅如何使用JavaScript写入文件（用户目录） ？

At file manager the folder would not be named the same as uploaded directory, though should retain folder and file structure. The folder should be located at last folder in File System at chrome profile folder, before Origins folder. See also How to Write in file (user directory) using JavaScript?

function errorHandler(e) {
  console.log(e)
}

function handleFiles(e) {
  console.log("file", file)
}

function handleDrop(event) {
  var dt = event.dataTransfer;
  for (var i = 0; i < event.dataTransfer.items.length; i++) {
    var entry = dt.items[i].webkitGetAsEntry();
    if (entry.isFile) {
      console.log("isFile", entry.isFile, entry);
      entry.file(handleFiles);
    } else if (entry.isDirectory) {
      console.log("isDirectory", entry.isDirectory, entry);
      window.webkitRequestFileSystem(window.TEMPORARY, 1024 * 1024
      , function(fs) {
        // create directory with uploaded directory name
        fs.root.getDirectory(entry.name, {
          create: true
        }, function(dirEntry) {
          // read folders, files in uploaded directory
          var reader = entry.createReader();
          reader.readEntries(function(entries) {
            entries.forEach(function(file) {
              // copy files to new directory
              file.copyTo(dirEntry);
              console.log("file:", file, "\ncopied to directory:", dirEntry)
            })
          })
        }, errorHandler)
      }, errorHandler)
    }
  }
}

plnkr http://plnkr.co/edit/oUIhwUc3CDxI64SrvxIh?p=preview

这篇关于jQuery文件上传插件：是否可以保留上传文件夹的结构？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！