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

2020-06-17 07:53:39易采站长站整理

Nodejs对文件上传的处理

在Express4里req.files已经是

undefined
了;现在用的最多的可能就是
formidable
了,你知道了它有个
progress
事件,于是心中大喜,低版本IE的进度条有戏了;OK,试一下:


form
.on('error',function(err){
console.log(err);
})
.on('aborted',function(){
console.log('aborted');
})
.on('progress',function(bytesReceived, bytesExpected){
var n=parseInt(parseFloat(bytesReceived/bytesExpected).toFixed(2)*100);
console.log(n);
});

是的,你很高兴的看到了,控制台按照预期打印了一串进度值;那么,再进一步;


form
.on('progress',function(bytesReceived, bytesExpected){
var n=parseInt(parseFloat(bytesReceived/bytesExpected).toFixed(2)*100);
res.write('<script>window.parent.call('+n+')</script>');
//无刷新上传,你们懂的 console.log(n);
});

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

接下来换个思路,试一下,将进度值保存到

session
里,额外加一个请求来轮询这个进度值,哎哟,不错哦!为了保证你请求的进度值是你这次上传的进度值而不是其他上传的进度值,需要在上传的请求里和额外的请求里约定一个
token
值;现在又来一个问题就是怎么在请求的时候得到这个
token
,由于文件上传的请求体在
Request Payload
里,所以
req.body
拿不到带过去的值,我也不想去解析这堆了,当然我也解析不了;放在
url
里最好,问题在于有时候得刷新两次来刷新
token
,不好!不得已,我还是放在
cookie
里吧!


var cookies=function () {
var cks=req.headers.cookie.split(';'),obj={};
for(var i=0;i<cks.length;i++){
obj[cks[i].split('=')[0].replace(/s+/ig,'')]=unescape(cks[i].split('=')[1]);
}
return obj;
}();
var queryToken=cookies.__token__;

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