HTML5 拖放 - 在 Safari 中检测文件夹(FileList、File)

Question

我已经在 J​​S (AJAX POST) 中设置了拖放文件上传脚本，但我在 Safari 中过滤文件夹时遇到了困难 - 版本 5.0.3 (6533.19.4)。

每当我将多个文件/文件夹放入浏览器时，Chrome 会过滤掉这些文件夹，而 Firefox 会为 .size 返回 0，因此防止这些情况变得微不足道。然而，Safari 将返回一个 68 字节的文件(文件夹的大小)。

有什么方法可以测试这个 File(FileList 中的项目)是否是一个文件夹？似乎无法在 File/Blob API 中找到任何内容测试此条件(尝试 .type 毫无意义，因为对于未知文件和文件夹，它不返回任何内容...)

更多信息:

基本上发生的情况是 AJAX 请求有一个空主体。我正在使用 FormData 上传:

var file = ...; // the dropped file
var formData = new FormData();
formData.append("file", file);
var xhr = new XMLHttpRequest();
...
xhr.send(formData);

Answer 1

我们可以使用 FileReader 读取文件。代码可以是这样的:

Array.prototype.forEach.call(e.dataTransfer.files, function (file) {
  var reader = new FileReader();
  reader.onload = function (event) {
    // it's a file
    addFile(file);
  };
  reader.onerror = function (event) {
    alert("Uploading folders not supported in Safari");
  }
  reader.readAsDataURL(file);
});

对于文件夹会报错:

Failed to load resource: The operation couldn’t be completed. (WebKitBlobResource error 4.)