js 文件下载 进度条

 /** ?* 下载文件 - 带进度监控 ?* @param url: 文件请求路径 ?* @param name: 保存的文件名 ?* @param progress: 进度处理回调函数
 ?* eg: progressDownLoad({url:‘http://loacalhost:8080/downLoad.action‘,‘file.rar‘,progress:function(percent){
 ?* ???????console.log(percent);
 ?* ????}}); ?**/ ?function progressDownLoad({url,filename,progress}){ ?????var req = new XMLHttpRequest(); ?????req.open("POST", url, true); ?????//监听进度事件 ?????req.addEventListener("progress", function (evt) { ?????????if (evt.lengthComputable) { ?????????????var percentComplete = evt.loaded / evt.total; ?????????????if(progress) try{ progress.call(percentComplete); }catch(e){} ?????????} ?????}, false); ?????req.responseType = "blob"; ?????req.onreadystatechange = function () { ?????????if (req.readyState === 4 && req.status === 200) { ?????????????if (typeof window.chrome !== ‘undefined‘) { ?????????????????// Chrome version ?????????????????var link = document.createElement(‘a‘); ?????????????????link.href = window.URL.createObjectURL(req.response); ?????????????????link.download = filename; ?????????????????link.click(); ?????????????} else if (typeof window.navigator.msSaveBlob !== ‘undefined‘) { ?????????????????// IE version ?????????????????var blob = new Blob([req.response], { type: ‘application/force-download‘ }); ?????????????????window.navigator.msSaveBlob(blob, filename); ?????????????} else { ?????????????????// Firefox version ?????????????????var file = new File([req.response], filename, { type: ‘application/force-download‘ }); ?????????????????window.open(URL.createObjectURL(file)); ?????????????} ?????????} ?????}; ?????req.send(); ?}