Reputation: 393
I'm trying to mget the progression of an upload (that would only be an image btw). I used XMLHttpRequest and pretty much did like everyone else on the internet did,as follows:
var upProgress = function(e) {
console.log(e.loaded, e);
};
var fd = new FormData();
fd.append('image', file);
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener('progress', upProgress, false);
xhr.open('POST', _Utilities.urlApi + url);
xhr.send(fd);
The image is uploaded, that part works.
However, the progress event (both in Firefox 31 and Chrome 36) is only triggered once (at the beginning) with e.loaded = e.total = file' size
. It works in IE 11, the event is triggered a dozen times for the same picture (about 2.7Mo).
I'm lost here, I search the web but didn't find anything that I haven't done already.
For example e.loaded
and e.total
should be the same when lengthComputable = false
which isn't the case here.
The above console log
display only 1 line in Chrome and Firefox, here's some of the content of the progress event element:
lengthComputable: true
loaded: 2797378
total: 2797378
totalSize: 2797378
type: "progress"
On IE however I get this (I log both the loaded value and the event's element):
149 [object ProgressEvent]
131072 [object ProgressEvent]
262144 [object ProgressEvent]
...
2752512 [object ProgressEvent]
2797384 [object ProgressEvent]
Which mean that it works as expected.
I don't know what could cause this. All of the above are tested on my machine. I came across some people who only had trouble with certain machine or setup, a friend tried on its machine and it does the same (windows 8.1 and Chrome), another friend tried for the same result (MACOS and Chrome).
If you have any idea, please share it here, thx in advance !
Upvotes: 2
Views: 1193
Reputation: 891
Please check my answer from here XMLHttpRequest upload progress not firing correctly, I had this too and after painful hours it was simply my antivirus program
... maybe it's related to yours too?
Upvotes: 1