JavaScript-如何在web页面实现文件批量下载?
比如页面有100个文件(每个文件都是不同的url),如何实现让用户只点击一次下载按钮将100个文件一起下载,而不用点击点击100次下载按钮或者在浏览器的弹出询问框中点100次同意下载.不要打包成压缩文件的方法,因为文件不在我的服务器上.
补充:
1 传统的浏览器下载方法肯定不行，因为如果用户的下载列表有100个文件，浏览器的弹窗提示能把用户直接吓跑。
2 最好类似以前web迅雷那种，能在页面内看见每个文件的下载进度。
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（22）
帮你找到一个 http://blog.csdn.net/mengshan1986/article/details/6655300
看看这里吧 应该跟你需求一样的 利用了 rfc822 还有测试代码
用一个按钮的事件里面分开捉取下载资源，可以做成勾选的样子，在开线程分开下载。
<!DOCTYPE HTML>
<html>
<body>
<button id="download">Download</button>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
$('#download').click(function() {
download('http://url1/downloadedFile1','http://url2/downloadedFile2');
});
var download = function() {
for(var i=0; i<arguments.length; i++) {
var iframe = $('<iframe style="visibility: collapse;"></iframe>');
$('body').append(iframe);
var content = iframe[0].contentDocument;
var form = '<form action="' + arguments[i] + '" method="GET"></form>';
content.write(form);
$('form', content).submit();
setTimeout((function(iframe) {
return function() {
iframe.remove();
}
})(iframe), 2000);
}
}
</script>
</body>
</html>
浏览器安全机制作用，这功能单独使用JS无法完成的。
解决办法就是客户端。或者wget方式。
我觉得最简单的办法就是点击下载按钮的时候，打开10个新窗口就OK了，地址分别是下载地址。
个人观点。
百度 就有这样的功能！ http://pan.baidu.com/ 建议你 研究一下！跟你所需要的是一样的！
自己写个插件，js把连接都取到，传给插件，插件挨个下载。
直接将要传输的文件放到web server的目录，然后在目标机器上执行：wget http://www.vpser.net/testfile.zip 就行了。
参考：http://www.vpser.net/manage/scp.html
下载提示框是不是显示是每个人电脑的设置，对于开发者来说，是无法控制的
所以才有了打包下载的方法，这样只需要点一下【开始下载】。
用楼上的方法的话，如果下载的文件是IE可以打开的，JPG，PDF，HTML等，浏览器有可能直接打开文件？
如果是服务器端编程，不局限于javascript的话，可以打开一个输出流，定义MIME类型，强制下载而不是打开
javascript 是实现不了的. 不过可以用sliverlight 或者flash来实现.
把多个网站的多个文件写到单个zip文件.
我们有个项目是用silverlight来实现的.
我觉得用js可以解决，每个文件一个路径，用checkbox 获取每个文件的url，然后用js发送请求
window.location="http://abc.com/xxoo.zip";
这句JS就可以下载文件了，用JS收集那10个地址，执行10次上面那句，就可以了。
应该是没有办法通过 js或者服务器端来实现。
出于安全考虑，浏览器肯定会询问用户是否保存或下载文件。
如果要实现批量下载，上面很多朋友都给了方案，只是浏览器肯定会一一询问用户。。
但迅雷有批量下载网页所有链接的功能，可以从这点出发来实现这个功能，前提要求用户装了迅雷或者能批量下载的客户端
还有一个，如果只要是实际一次确认，能下载所有的文件又不打包，可以试一下制作bt种子，或者写个页面自动生成种子文件。。
你可以将这些链接生成一个.torrent种子文件，客户端见到种子文件，会自动开启下载工具，完成下载。
首先,flash或者silverlight无法实现你说的需求,IE下载API接口不会因为用了flash就可以跳过用户选择直接下文件到用户硬盘
另外你说的让用户看到下载进度,如果下载文件不在你的服务器,并且你不愿意浪费带宽去做个反向代理让用户从你服务器下文件浪费多余带宽,那这是无法实现的
解决方法1:
可以用ajax get导出文件,从而最大程度上减少浏览器询问可能,也使下载更为灵活,目前新浪爱问(http://ishare.iask.sina.com.cn)就是这么做的
StartGETRequest方法,用于发起一个ajax get请求:
function StartGETRequest(url, handler)
{
xmlhttp = null;
if (is_ie) {
var control = (is_ie5) ? "Microsoft.XMLHTTP" : "Msxml2.XMLHTTP";
try {
xmlhttp = new ActiveXObject(control);
} catch(e) {
alert("You need to enable active scripting and activeX controls");
DumpException(e);
}
} else {
xmlhttp = new XMLHttpRequest();
}
xmlhttp.onreadystatechange = function() {handler();}
if (url.indexOf("?") != -1){
var urltemp = url + "&rand=" + UniqueNum();
} else {
var urltemp = url + "?rand=" + UniqueNum();
}
//alert(urltemp);
xmlhttp.open('GET', urltemp, true);
xmlhttp.send(null);
}
下载一个文件则使用:
StartGETRequest("http://abc.com/xxx.zip",function(){alert("下载完成")});
回调函数
function(){alert("下载完成")}可以忽略一次下载多个文件则可以:
StartGETRequest("http://abc.com/1.zip",function(){});
StartGETRequest("http://abc.com/2.zip",function(){});
StartGETRequest("http://abc.com/3.zip",function(){});
...
解决方法2:
你可以模拟用户点击来进行批量下载,但这在不同浏览器下表现情况并不一致,但这种方案是对原始页面修改最少的
例如,原始页面下载链接为:
<a href="1.zip" class="downloadable">1</a>
<a href="2.zip" class="downloadable">2</a>
<a href="3.zip" class="downloadable">3</a>
你可以用:
$("a.downloadable").trigger("click")
仅这一行javascript模拟用户点击所有可下载链接,你可以试下这种方案在各种浏览器下的表现
解决方法3:
输出下载所有下载链接入剪贴板或者一个单独的textarea文本框,每行一个链接,让用户自己用下载工具去下载,目前人人影视就是这么做的
例如:http://www.yyets.com/php/resource/11005
这个方法虽然不是你的问题,但这应是用户最喜欢的下载方式,提供给你参考
简单的思路：用户点击下载的时候，可以跳转到某个下载页面，将需要下载的文件作为参数提交过去，然后在这个页面进行文件压缩后再进行下载，这个过程的速度可能会有点慢。
1.JS必然实现不了
2.flash缓存只能存成一个文件.所以也没的玩.
3.唯一可行的方法是有客户端.web迅雷是有客户端的.
结论:没有客户端或者浏览器插件.那这事没一点希望!
这个可以试试队列机制,例如 rabbitmq,与之对应的php扩展是amqp.思路可以是这样:
前端接受到请求之后,同时做两件事请:1在response页面上展现下载准备.2往mq里仍一个请求,然后由mq通过向下载服务器的接口发送消息.这样可以减少服务器负载做分离.可以尝试一下.
如果实在很难弄，那么建议你把用户可能下载的文件预先下载到你的服务器上，然后打包，在提供下载功能！！！
IE之类的下载文件一定有提示框，就算是Chrome一类不确认的也会在下载栏有提示信息产生出来，要不然岂不是太不安全了……
一般打包下载好像是服务器端动态生成一个zip文件出来然后，如果是可以选要哪些的话。jQueryUI的打包下载就是这样子的。
不太清楚Js是否能实现，但是我看到一个开源项目是用FlashApi来写Js的，里面有类似Flash的加载系统，你可以挖开来看看。https://github.com/PixelsCommander/FlashJS
使用JS捕获任意下载链接的click事件。
然后考虑几种方式，
1，调用迅雷等下在插件实现批量下载
2，使用Flash或sliverlight等方式实现批量下载。
3，在服务端把文件打包或者把文件进行二进制拼接（提供用户客户端分割工具）
chrome浏览器的话倒是有可能不会弹框（这要根据用户浏览器设置）