2014-04-03 10 views
9

Ich versuche, ein Upload-Formular zu implementieren und den Upload-Status zurückgeben, um den Benutzer mit xhr zurückgeben. Alles scheint korrekt implementiert zu sein, allerdings scheinen die Callbacks beim Hochladen viel zu schnell aufzutreten und einen viel höheren Prozentsatz zurückzuliefern, als tatsächlich aufgetreten ist.XMLHttpRequest Fortschrittsereignis geht viel schneller als der tatsächliche Upload

Mit Dateien ~ < 20Mb, bekomme ich sofort einen Rückruf, der über 99% zeigt, während der Upload für einige Zeit im Hintergrund weiterläuft.

Sehen Sie die folgende screengrab, die die Konsole von einer 74Mb-Datei zeigt. Dies wurde ein paar Sekunden nachdem der Upload initialisiert wurde und der Upload für weitere ~ 60 Sekunden fortgesetzt (merke, dass nur 3 Callbacks registriert sind (geladene Gesamtgröße) (berechneter Prozentsatz) und der Ajax-Upload mit dem Throbber fortfährt).

Hat jemand dies erlebt und eine genaue Darstellung des Upload-Status erreicht?

(das 'Last' Ereignis löst korrekt nach dem Upload-Prozess)

Hier ist mein Code:

$(this).ajaxSubmit({ 
    target: '#output', 
    beforeSubmit: showRequest, 
    xhr: function() 
    { 
     myXhr = $.ajaxSettings.xhr(); 
     if (myXhr.upload) 
     { 
      console.log('have xhr'); 
      myXhr.upload.addEventListener('progress', function(ev){ 
       if (ev.lengthComputable) { 
        console.log(ev.loaded + " " + ev.total); 
        console.log((ev.loaded/ev.total) * 100 + "%"); 
       } 
      }, false); 

     } 
     return myXhr; 
    }, 
    dataType: 'json', 
    success: afterSuccess 
}); 

enter image description here

+3

Das mag seltsam klingen, aber - haben Sie zufällig ein Antivirus installiert? Und wenn Sie haben, wird das gleiche Verhalten beobachtet, wenn Sie das Antivirus deaktivieren? – raina77ow

+0

Auf Ihren Vorschlag davon vielleicht etwas damit zu tun haben. Ich habe es zum ersten Mal von meiner Heim-Maschine (Mac, kein Antivirus) ausprobiert (war auf meinem Arbeits-PC) und es funktioniert wie ein Zauber! Ich werde versuchen, das Antivirenprogramm auf dem Arbeits-PC zu deaktivieren und zu überprüfen, ob dies Auswirkungen hat. Vielen Dank für die heads-up! – Fraser

+0

@ raina77ow Sieht aus wie das Antivirus ist die Ursache. Ich habe es auf meiner Arbeitsmaschine deaktiviert und es funktioniert jetzt großartig. Vielen Dank. Pop deine Antwort unten und ich werde das Kopfgeld freigeben. – Fraser

Antwort

7

Es gibt mehrere Berichte über das gleiche Verhalten - falscher Fortschrittsbericht über Datei-Upload - verursacht durch eine Antivirus-Software, die die zu ladenden Dateien prüft. Meine Vermutung ist, dass ein Teil des Antivirus versucht, eine mögliche Verzögerung (verursacht durch die Überprüfung) auszugleichen - und es nicht richtig macht.

+0

Hatte das gleiche Problem, das hat es gelöst. Hoffentlich kann ich bald eine Arbeit finden. –

+1

Haben Sie eine Arbeit gefunden? Ich habe das gleiche Problem ... – Benoit

1

Ich hatte das gleiche Problem in letzter Zeit. Ich denke, Ihr Ajax-Anruf wird einfach zurückgegeben, bevor Ihre Datei hochgeladen wird. Um dieses Problem zu umgehen, laden Sie das, was Sie hochgeladen haben, und überprüfen Sie das Ereignis load. wenn Sie ein Bild zum Beispiel das Hochladen (mit jQuery):

var loadCheck = $('<img src="' + uploadedUrl +'">').hide().appendTo('body'); 
loadCheck.on('load', updateProgressBar()); 

Natürlich können Sie es auf eine andere Art von Dateien implementieren und integrieren eine $ .each Iteration.

Verwandte Themen