如何在web页面实现文件批量下载?


比如页面有100个文件(每个文件都是不同的url),如何实现让用户只点击一次下载按钮将100个文件一起下载,而不用点击点击100次下载按钮或者在浏览器的弹出询问框中点100次同意下载.不要打包成压缩文件的方法,因为文件不在我的服务器上.

补充:
1 传统的浏览器下载方法肯定不行,因为如果用户的下载列表有100个文件,浏览器的弹窗提示能把用户直接吓跑。
2 最好类似以前web迅雷那种,能在页面内看见每个文件的下载进度。

Web开发 JavaScript

萬事屋D曉 12 years, 8 months ago

首先,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
这个方法虽然不是你的问题,但这应是用户最喜欢的下载方式,提供给你参考

戦術的敗北 answered 12 years, 8 months ago

Your Answer