Arrastrar y soltar HTML5: detectar carpetas en Safari(FileList, File)

drag-and-drop filter

Question

He configurado una secuencia de comandos de carga de archivo arrastrar y soltar en JS (AJAX POST) y tengo dificultades para filtrar carpetas en Safari - Versión 5.0.3 (6533.19.4).

Cada vez que elimino múltiples archivos / carpetas en el navegador, Chrome filtrará las carpetas, y Firefox devolverá 0 para .size así que es trivial protegerse contra esos casos. Safari, sin embargo, devolverá un archivo de 68 bytes (el tamaño de la carpeta).

¿Hay alguna manera de probar si este File (elemento en FileList ) es una carpeta? Parece que no puede encontrar nada en la API File / Blob que prueba esta condición (no tiene sentido tratar con .type , ya que no devuelve nada para los archivos desconocidos ni para las carpetas ...)

Un poco más de información:

Básicamente, lo que sucede es que la solicitud AJAX tiene un cuerpo vacío. Estoy cargando con FormData :

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

Answer 1

Podemos leer un archivo, con FileReader . El código puede ser así:

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

Para las carpetas dará error:

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

Answer 2

¿Por qué no solo verifica el sufijo de archivo de oldschool? Debería funcionar en la mayoría de los casos donde "file.suf" es un archivo y "file" es una carpeta ...

Answer 3

Podrías detectar si se trata de un archivo o una carpeta en el servidor con datos de entrada sin formato: obtener datos de entrada sin procesar

Noté que las carpetas solo tienen límite de forma al principio y ninguna al final. Así que, básicamente, parece que el navegador comienza a publicar y luego se detiene antes de completar la solicitud. (Solo probé esto con safari, pero supongo que es lo mismo con otros navegadores).

Podría guardar la carga fallida en la sesión y luego usar AJAX para probar si la carga fallida generó tal solicitud. Tienes una solicitud AJAX adicional, pero al menos puedes detectarla. Es la mejor opción que he encontrado hasta ahora.