Subir archivo con AJAX y FileAPI

[mariomon17]

Hola a todos

Utilizo drag and drop y File API de HTML5 para poder arrastrar un archivo a un div.
Luego leo el archivo como texto, lo meto en una variable que mediante AJAX la paso a un archivo .php que crea el archivo y le mete el contenido de la variable.

Todo funciona correctamente hasta que voy a revisar el archivo y veo que no ocupa mas de 800kb y claro, esta dañado.

Cual es el error?

Un saludo y gracias

[maycolalvarez]

a lo sumo no me aventuraría todavía a realizar uploads vía AJAX+ fileAPI, pero de hacerlo leería en modo binario, además de asegurarme de enviar la data por POST.

+info http://blog.zedplan.com/tag/html5

[mariomon17]

Al final lo he solucionado utilizando el objeto FormData http://dev.w3.org/2006/webapi/XMLHtt...rface-formdata

Recojo el archivo (ya sea recogiendo el file de un formulario o con un drag and drop) y con el metodo append() introduzco el archivo en el objeto FormData.

Ese objeto lo pongo en la peticion AJAX. Con lo cual en el archivo php recibo el archivo con $_FILE[] y no con $_POST[].

Código Javascript:

file = 
 
formdata = new FormData();  
formdata.append("files[]", file); 
 
$.ajax({  
        url: "upload.php",  
        type: "POST",  
        data: formdata,  
        processData: false,  
        contentType: false,  
        success: function (res) {  
            document.getElementById("response").innerHTML = res;  
        }  
    });
 

Si hubiese un drag and drop necesitariamos esos metodos.
Y si fuese una imagen y quisieramos mostrarla utilizariamos el objeto FileReader (File API de HTML5).

La info la aprendi de aqui: http://net.tutsplus.com/tutorials/ja...les-with-ajax/

Un saludo y gracias