cómo saber si XMLHttpRequest.send() funcionó

Question

Estoy usando XMLHttpRequest para enviar un archivo del código javascript a un django view. Tengo que detectar si el archivo se ha enviado o si se produjo algún error. Utilicé jquery para escribe el siguiente javascript.

Idealmente, me gustaría mostrar al usuario un mensaje de error que indica que el archivo no se ha subido. ¿Hay alguna forma de hacerlo en javascript?

Traté de hacer esto mediante la devolución de un mensaje de success/failuredjango view, poniendo el success/failed message como json y devolver el JSON serializado desde el django view .Por esto, hice la xhr.open()non-asynchronous. Traté de imprimir del objeto xmlhttpRequestresponseText .El console.log(xhr.responseText) muestra

response= {"message": "success"} 

Lo que me pregunto es, si esta es la forma correcta de hacerlo this.In muchos artículos, me encontré con la advertencia de que

No se recomienda utilizar async = false

Entonces, ¿hay alguna manera de saber si el archivo ha sido enviado, manteniendo xhr.open() asíncrono? presentar

$(document).ready(function(){ 
    $(document).on('change', '#fselect', function(e){ 
      e.preventDefault(); 
      sendFile(); 
     }); 
}); 

function sendFile(){ 
    var form = $('#fileform').get(0); 
    var formData = new FormData(form); 
    var file = $('#fselect').get(0).files[0]; 
    var xhr = new XMLHttpRequest(); 
    formData.append('myfile', file); 
    xhr.open('POST', 'uploadfile/', false); 
    xhr.send(formData); 
    console.log('response=',xhr.responseText); 
} 

Mis django extractos vista de los datos del formulario y escribe en una carpeta de destino.

def store_uploaded_file(request): 
    message='failed' 
    to_return = {} 
    if (request.method == 'POST'):   
     if request.FILES.has_key('myfile'): 
     file = request.FILES['myfile'] 
     with open('/uploadpath/%s' % file.name, 'wb+') as dest: 
      for chunk in file.chunks(): 
       dest.write(chunk) 
       message="success" 
    to_return['message']= message 
    serialized = simplejson.dumps(to_return) 
    if store_message == "success": 
     return HttpResponse(serialized, mimetype="application/json") 
    else: 
     return HttpResponseServerError(serialized, mimetype="application/json") 

EDIT:

Tengo este trabajo con la ayuda de @ FabrícioMatté

xhr.onreadystatechange=function(){ 
     if (xhr.readyState==4 && xhr.status==200){ 
      console.log('xhr.readyState=',xhr.readyState); 
      console.log('xhr.status=',xhr.status); 
      console.log('response=',xhr.responseText); 

      var data = $.parseJSON(xhr.responseText); 
      var uploadResult = data['message'] 
      console.log('uploadResult=',uploadResult); 

      if (uploadResult=='failure'){ 
      console.log('failed to upload file'); 
      displayError('failed to upload'); 
      }else if (uploadResult=='success'){ 
      console.log('successfully uploaded file'); 
      } 
     } 
    } 

Answer 1

XMLHttpRequest objetos contienen los status y readyState propiedades, que se pueden probar en el xhr.onreadystatechange caso para comprobar si su solicitud fue exitosa

Answer 2

Algo así como el siguiente código debe hacer el trabajo:

xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState === 4) { 
    var response = JSON.parse(xmlhttp.responseText); 
     if (xmlhttp.status === 200 && response.status === 'OK') { 
     console.log('successful'); 
     } else { 
     console.log('failed'); 
     } 
    } 
}