js⽂件下载进度条实现/**
* 下载
* @param  {String} url ⽬标⽂件地址
* @param  {String} filename 想要保存的⽂件名称
*/
download(url: string, filename: string){
this.saveAs(blob, filename);
});
}
/**
* 获取  blob
* @param  {String} url ⽬标⽂件地址
* @return {Promise}
*/
getBlob(url: string){
return new Promise(resolve =>{
let that =this;// 创建XMLHttpRequest，会让this指向XMLHttpRequest，所以先接收⼀下this const xhr =new XMLHttpRequest();
xhr.open("GET", url,true);
//监听进度事件
xhr.addEventListener(
"progress",
function(evt){
if(evt.lengthComputable){
let percentComplete = evt.loaded / al;
that.percentage = percentComplete *100;
// console.log('percentComplete 0 ---------------');
// console.log(percentComplete);
// console.log(that.percentage);
// const dom1: any = document.querySelector('#percentage_tm_drawer');
// console.log(dom1);
// console.log(this);
// console.log(env);
/
/ console.log('percentComplete 1 ---------------');
// console.log(dom1['percentage']);
// dom1['percentage'] = percentComplete * 100;
// console.log(dom1['percentage']);
// $("#progressing").html((percentComplete * 100) + "%");
}
},
getsavefilenamefalse
);
if(xhr.status ===200){
sponse);
}
};
xhr.send();
});
}
/**
* 保存
* @param  {Blob} blob
* @param  {String} filename 想要保存的⽂件名称
*/
saveAs(blob: any, filename: string){
saveAs(blob: any, filename: string){
// ie的下载
if(window.navigator.msSaveOrOpenBlob){
navigator.msSaveBlob(blob, filename);
}else{
// ⾮ie的下载
const link = ateElement("a");
const body: any = document.querySelector("body");
link.href = ateObjectURL(blob);
link.download = filename;
// fix Firefox
link.style.display ="none";
body.appendChild(link);
link.click();
vokeObjectURL(link.href);
}
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。