javascript怎么实现多个任务一次下载的方法 - 行业资讯 - 肥雀云

　　介绍

这篇文章给大家分享的是有关javascript怎么实现多个任务一次下载的方法的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。

<强>真实经历

最近开发项目需要做文件下载,想想挺简单的,之前也做过,后台提供下载接口,前端使用<代码> window.location。href> 下载按钮需要下载两个文件,而且不能使用压缩包的形式。想想不是也挺简单,点击下载发送两个下载请求不就搞定了么。

说干就干,三下五除二就写好了,当点击下载的那一刻懵逼了,第一个请求竟然自动取消了,顿时一万个草泥马崩腾而过(因为是国外服务器,下载比较慢导致第一个请求被取消),这就意味着快速点击不同的下载按钮也会有同样的问题,这不行啊,然后开始了自己的下载探索之旅。

<强>标签,的位置。href

我们知道一个标签及href指向的如果是一个下载链接,那么相当于下载文件,对于单文件下载还是ok的,不过快速点击几个下载按钮,有的下载会被取消,这可不行,继续百度。

上一段代码:

const下载=(url)=祝辞{ 　　window.location。href=https://www.yisu.com/zixun/url; 　　}

<>强window.open

我们知道窗口。开放可以打开一个新窗口,那么是不是可以实现下载呢,激动的我赶紧试了试,下载的确可以,不过会快速打开一个新窗口并且关闭,体验非常不好,果断放弃了。

<强> iframe

突然想到iframe也可以向服务器发请求的,激动的我又赶紧试了试,哇塞,果然可以下载,而且没有违和感,代码贴出来。

出口const downloadFile=(url)=比;{ 　　const iframe=document.createElement (“iframe"); 　　iframe.style。显示=皀one";//防止影响页面　　iframe.style。身高=0;//防止影响页面　　iframe。src=https://www.yisu.com/zixun/url; 　　document.body.appendChild (iframe);//这一行必须,iframe挂在到dom树上才会发请求//5分钟之后删除(onload方法对于下载链接不起作用,就先抠脚一下吧) 　　setTimeout (()=> { 　　iframe.remove (); 　　},5 * 60 * 1000); 　　}

ps: iframe不会相互影响,可以连续下载哦!

<强>其他方案

当然还有一些其他方式,形式下载,二进制流下载等,有空的小伙伴自行研究吧!

感谢各位的阅读!关于javascript怎么实现多个任务一次下载的方法就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到吧!