Kéo và thả HTML5 - phát hiện thư mục trong Safari (FileList, File)

Question

Tôi đã thiết lập tập lệnh tải lên tệp kéo và thả trong JS (AJAX POST) và tôi đang gặp khó khăn khi lọc thư mục trong Safari - Phiên bản 5.0.3 (6533.19.4).

Bất cứ khi nào tôi thả nhiều tệp/thư mục vào trình duyệt, Chrome sẽ lọc ra các thư mục và Firefox sẽ trả lại 0 cho .size do đó nó tầm thường để bảo vệ chống lại các trường hợp đó. Tuy nhiên, Safari sẽ trả lại tệp 68 byte (kích thước của thư mục).

Có cách nào để kiểm tra xem điều này File (mục trong FileList) là một thư mục không? dường như không thể tìm thấy bất cứ điều gì trong File/Blob API mà kiểm tra cho tình trạng này (không có điểm trong cố gắng .type, vì nó sẽ trả về không có gì cho các tập tin không rõ cũng như các thư mục ...) biết thêm

Một chút:

Về cơ bản điều xảy ra là yêu cầu AJAX có thân trống. Tôi đang tải lên với FormData:

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

Answer 1

Tại sao không chỉ kiểm tra hậu tố tệp oldschool? Nên làm việc trên hầu hết các trường hợp "file.suf" là một tập tin và "tập tin" là một thư mục ...

Answer 2

Bạn có thể phát hiện cho dù đó là một tập tin hoặc thư mục trên máy chủ sử dụng bài thô dữ liệu: Get raw post data

Tôi nhận thấy rằng các thư mục chỉ có đường biên dạng ở đầu và không có thư mục nào ở cuối. Vì vậy, về cơ bản có vẻ như trình duyệt bắt đầu thực hiện bài đăng và sau đó dừng lại trước khi hoàn thành yêu cầu. (Tôi chỉ thử nghiệm điều này với safari nhưng tôi đoán nó giống với các trình duyệt khác.)

Bạn có thể lưu tải lên không thành công trong phiên rồi sử dụng AJAX để kiểm tra xem tải lên không thành công có tạo yêu cầu như vậy không. Bạn có một yêu cầu AJAX có điều kiện, nhưng ít nhất bạn có thể phát hiện nó. Đó là lựa chọn tốt nhất tôi đã tìm thấy cho đến nay.

Answer 3

Chúng tôi có thể đọc tệp, với FileReader. Mã có thể như thế này:

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); 
}); 

Đối với thư mục nó sẽ cho lỗi:

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