javascript - jquery file upload progress bar inaccurate

Question

I am using jquery file upload (http://blueimp.github.io/jQuery-File-Upload/) plugin.

My Code:

$('#fileupload').fileupload({
    url: 'server/index.php',
    dataType: 'json',
    dropZone: $('#dropzone'),
}).bind('fileuploadprogress', function (e, data) {
    var progress = parseInt(data.loaded / data.total * 100, 10);
    $('.progress-bar').css('width', progress + '%');
});

When I do the file upload, the progress bar is very inaccurate. Every time when I upload no matter what size the file is, the progress bar will always stuck at around 10% until the file is upload finish, then it will directly goes up to 100%.

Why is it behave like that? How can I fix it to properly display the progress?

Thank you.

Answer 1

I'm having the file progress bar issue too. The odd thing is that the same implementation works on another site I have developed, but not on another. Odd as it may be, I struggled for hours trying to find out what is going on. I read another problem somewhere and blueimp here says it tested fine using similar setups, and someone mentioned that they had a proxy. Well I don't have a proxy, but then I checked it on another computer. Works fine, yet another computer, works fine again. Then I disabled AVG on my main computer, and wouldn't you know, works fine. Seems that with AVG enabled my data.loaded would almost always be the same as data.total. I'm sure it has to do with some stupid cache or something that they implement to "boost" your browsing speed.