Carica file con Ajax XmlHttpRequest

Ciao sto cercando di inviare file con xmlhttprequest con questo codice.

 var url= "http://localhost:80/...."; $(document).ready(function(){ document.getElementById('upload').addEventListener('change', function(e) { var file = this.files[0]; var xhr = new XMLHttpRequest(); xhr.file = file; // not necessary if you create scopes like this xhr.addEventListener('progress', function(e) { var done = e.position || e.loaded, total = e.totalSize || e.total; console.log('xhr progress: ' + (Math.floor(done/total*1000)/10) + '%'); }, false); if ( xhr.upload ) { xhr.upload.onprogress = function(e) { var done = e.position || e.loaded, total = e.totalSize || e.total; console.log('xhr.upload progress: ' + done + ' / ' + total + ' = ' + (Math.floor(done/total*1000)/10) + '%'); }; } xhr.onreadystatechange = function(e) { if ( 4 == this.readyState ) { console.log(['xhr upload complete', e]); } }; xhr.open('post', url, true); xhr.setRequestHeader("Content-Type","multipart/form-data"); xhr.send(file); }, false); });  

ma ho ricevuto questo errore: la richiesta è stata respinta perché non è stato trovato nessun limite multipart in aiuto di pls ..

  1. Non esiste qualcosa come xhr.file = file; ; l’object file non dovrebbe essere collegato in questo modo.
  2. xhr.send(file) non invia il file. È necessario utilizzare l’object FormData per avvolgere il file in un object multipart/form-data post multipart/form-data :

     var formData = new FormData(); formData.append("thefile", file); xhr.send(formData); 

Dopodiché, il file può accedere a $_FILES['thefile'] (se stai usando PHP).

Ricorda, le demo di MDC e Mozilla Hack sono i tuoi migliori amici.

EDIT : il (2) sopra era errato. Invia il file, ma lo invierà come dati post non elaborati. Ciò significa che dovresti analizzarlo sul server (e spesso non è ansible, dipende dalla configurazione del server). Leggi come ottenere i dati grezzi dei post in PHP qui .