这篇文章给大家分享的是有关javascript怎么实现多个任务一次下载的方法的内容。小编觉得挺实用的，因此分享给大家做个参考。一起跟随小编过来看看吧。
成都网站建设哪家好，找
创新互联公司！专注于网页设计、
成都网站建设、微信开发、
微信平台小程序开发、集团
成都企业网站定制等服务项目。核心团队均拥有互联网行业多年经验，服务众多知名企业客户；涵盖的客户类型包括：
餐厅设计等众多领域，积累了大量丰富的经验，同时也获得了客户的一致认可！
真实经历
最近开发项目需要做文件下载，想想挺简单的，之前也做过，后台提供下载接口，前端使用window.location.href就行了呗。不过开发的时候发现，有些文件有附属文件，点击下载按钮需要下载两个文件，而且不能使用压缩包的形式。想想不是也挺简单，点击 下载 发送两个下载请求不就搞定了么。
说干就干，三下五除二就写好了，当点击 下载 的那一刻懵逼了， 第一个请求竟然自动Cancelled了，顿时一万个草泥马崩腾而过(因为是国外服务器，下载比较慢导致第一个请求被Cancelled)，这就意味着快速点击不同的 下载 按钮也会有同样的问题，这不行啊，然后开始了自己的下载探索之旅。
a标签 & location.href
我们知道a标签及href指向的如果是一个下载链接，那么相当于下载文件，对于单文件下载还是ok的，不过快速点击几个下载按钮，有的下载会被Cancelled，这可不行，继续百度。
上一段代码：
const download = (url)=>{
window.location.href = url;
}window.open
我们知道window.open可以打开一个新窗口，那么是不是可以实现下载呢，激动的我赶紧试了试，下载的确可以，不过会快速打开一个新窗口并且关闭，体验非常不好，果断放弃了。
iframe
突然想到iframe也可以向服务器发请求的，激动的我又赶紧试了试，哇塞，果然可以下载，而且没有违和感，代码贴出来。
export const downloadFile = (url) => {
const iframe = document.createElement("iframe");
iframe.style.display = "none"; // 防止影响页面
iframe.style.height = 0; // 防止影响页面
iframe.src = url;
document.body.appendChild(iframe); // 这一行必须，iframe挂在到dom树上才会发请求
// 5分钟之后删除（onload方法对于下载链接不起作用，就先抠脚一下吧）
setTimeout(()=>{
iframe.remove();
}, 5 * 60 * 1000);
}ps： iframe不会相互影响，可以连续下载哦!
其他方案
当然还有一些其他方式，Form下载、二进制流下载等，有空的小伙伴自行研究吧!
感谢各位的阅读！关于javascript怎么实现多个任务一次下载的方法就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到吧！
文章名称：javascript怎么实现多个任务一次下载的方法-创新互联
标题网址：
http://cdkjz.cn/article/dgggco.html
