Javascript jquery文件上载进度条不准确
我正在使用jquery文件上传()插件 我的代码:Javascript jquery文件上载进度条不准确,javascript,jquery,jquery-file-upload,Javascript,Jquery,Jquery File Upload,我正在使用jquery文件上传()插件 我的代码: $('#fileupload').fileupload({ url: 'server/index.php', dataType: 'json', dropZone: $('#dropzone'), }).bind('fileuploadprogress', function (e, data) { var progress = parseInt(data.loaded / data.total * 100, 10
$('#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 + '%');
});
当我上传文件时,进度条非常不准确。每次我上传文件时,无论文件大小,进度条总是停留在10%左右,直到文件上传完成,然后它将直接上升到100%
为什么会这样?如何修复它以正确显示进度
谢谢。我也遇到了文件进度条问题。奇怪的是,相同的实现可以在我开发的另一个站点上运行,但不能在另一个站点上运行。尽管这可能很奇怪,但我花了几个小时努力想弄清楚到底发生了什么。我在某个地方读到另一个问题,这里的blueimp说它使用类似的设置进行了测试,并且有人提到他们有一个代理。我没有代理,但我在另一台电脑上查过了。工作正常,但另一台计算机又工作正常。然后我在我的主计算机上禁用了AVG,你不知道吗,工作正常。似乎启用AVG后,我的data.load几乎总是与data.total相同。我敢肯定这与一些愚蠢的缓存或者他们用来“提高”你的浏览速度的东西有关。问题是,当你使用默认的
自动上传
选项时,文件会在添加
回调中立即提交,并且对于第一次n
调用progressall
回调,数据.总计
未完全更新。(n
取决于工作站速度和progressInterval
选项)
我找到的解决方案是在第一次调用add
时计算总文件长度,并在progressall
中使用它
var originalAdd = $.blueimp.fileupload.prototype.options.add;
var iFilesCount = 0;
var dataTotal = 0;
$('#fileupload').fileupload({
...
progressall: function (e, data) {
if (dataTotal == 0) {
dataTotal = 1;
}
var iProgress = parseInt(data.loaded / dataTotal * 100, 10);
$('#progress .progress-bar').css('width', iProgress + '%');
},
add: function (e, data) {
if (iFilesCount <= 0) {
iFilesCount = data.originalFiles.length;
dataTotal = 0;
var i = 0;
// sum up files lengths
for (i=0; i < iFilesCount ;i++){
dataTotal = dataTotal + data.originalFiles[i].size;
}
}
iFilesCount--;
// recall default add callback
originalAdd.call(this, e, data);
}
...
}
您正在测试的文件有多大?您是否在远程而不是本地测试了它?由于带宽==磁盘访问带宽,文件将立即上载到本地。@thetrompf是的,起初我是在本地测试的。感觉一切都很顺利。但是,当我尝试使用托管服务器时,我遇到了问题中所述的问题。您使用的是哪种浏览器和web服务器?@thetrompf Firefox和Dreamhost。测试与IE 11以及,也不准确。当文件刚开始上传时,进度条从0%直接变为100%。您正在测试的文件的大小是多少?进度回调是基于时间间隔调用的,如果对小文件调用不够频繁,它似乎会立即从0变为100,或者可能您使用的文件太小,占用了您的带宽。因此,文件将在调用第一个fileprogress回调之前上载。很好的发现,它节省了我调试的时间。
536710 / 1610128 / 30060524 \
1073418 / 6977218 / 30060524 |
1610128 / 8587402 / 30060524 |
2146838 / 12881204 / 30060524 |
2683550 / 13954660 / 30060524 |
3220258 / 16638300 / 30060524 |-- progress bar is not accurate
3756968 / 19858646 / 30060524 |
4293676 / 24689178 / 30060524 |
4830384 / 27909544 / 30060524 /
5367092 / 30060524 / 30060524 \
5903800 / 30060524 / 30060524 |
6440510 / 30060524 / 30060524 |
6977218 / 30060524 / 30060524 |
7513946 / 30060524 / 30060524 |
8050674 / 30060524 / 30060524 |-- accurate progress bar
... |
... |
30060524 / 30060524 / 30060524 /