Node.js实现兼容IE789的文件上传进度条

2020-06-18 05:58:39易采站长站整理

req.session['file'+queryToken]={
token:queryToken,
percent:n
}
};
console.log(n);
});

为了IE789,我来轮询进度值了,原谅我,其实我的心很痛;


var getData=function(){
$.post('/uploader',{
getfileinfo:1,
uploadtoken:utils.cookie.getCookie('__token__')
})
.then(function(data){
console.log(data);
if (data.mes<0) {
getData();
}else{
var pros=data.info;
call(pros.percent);
if (pros.percent!='100') {
getData();
};
};
});
}
getData();

call
方法即在页面上显示进度值;很不幸,你只能看到最后的100%,看不到上传具体详细的进度值;再探…

好吧,我又一次沦陷了;不过还是感觉不对劲,ajax轮询没有问题,问题在于

session
里要等到上传完毕才有值,所以只能看到100%,看不到详细进度值;我是否可以认为,在progress里,之前的
res.write
和这次的
req.session
被挂起了呢,但是它又保存了每次的执行结果,直到
progress
完再释放,所以只能看到100%;没心情看
formidable
的源码,当然我也看不咋懂,我就先这么认为吧!

既然

ajax
轮询没问题,那么就是保存到
session
不得劲了;实在不成,放到
global
里试试吧,总不会往全局对象里塞个值也会挂起吧;稍作改动放到
global
里:


form
.on('progress',function(bytesReceived, bytesExpected){
var n=parseInt(parseFloat(form.bytesReceived/form.bytesExpected).toFixed(2)*100);
if (global['file'+queryToken]) {
global['file'+queryToken].percent=n;
}else{
global['file'+queryToken]={
token:queryToken,
percent:n
}
};
console.log(n);
});

继续轮询。

漂亮,完全就是那么回事!在chrome里看到的和HTML5的进度一个效果,只是在IE789里会有点卡顿的感觉,不过还是能看到详细的进度值的;毕竟老浏览器身子骨不咋地,你们懂的;还有,每次上传都往

global
里塞值,怎么也得适当的清理一下吧,文件上传完毕,转移到指定目录后
global['file'+queryToken]=null

然而,轮询,就是一个接一个好多好多的请求,这里也许会出问题;要不限制一下吧,间隔500ms请求一次进度值;恩,IE789进度条就这么解决了,说好的丢掉flash;虽然这个轮询可以兼容所有浏览器,但毕竟要浪费那么多请求,还是判断下,在IE789以外继续HTML5吧!

相关文章 大家在看