1、文件下载页面用来显示要下载的文件数量和大小,以及总文件大小。数据展示这里就不贴了,就贴后面需要用到的三个弹出层吧:遮罩层、文件下载提示框、下载完成弹出框。
<!-- 遮罩层 --> <div id="zhegai" style="display:none;width:100%;height: 100%;top:0px;left:0px;position:absolute;filter:Alpha(Opacity=50);z-index:1000;background:#000000;-moz-opacity: 0.5; opacity:.50; " > <iframe style="width:100%;height:100%;filter:Alpha(Opacity=10);position:absolute;z-index='1001';border:none\' frameborder=\'no\' border=\'0\' "></iframe> </div> <!-- 稍后框 --> <div align="center" id="msgDiv" style="display:none; border:0px;z-index:9999999; position: absolute; text-align: center;background:none; width: 300px; font: 12px/25px Verdana, Geneva, Arial, Helvetica, sans-serif; height: 100px;margin-top:-50px; margin-left: -150px; top: 50%; left: 50%;"> <img src="admin/img/wait.gif"/> <br /> <span style="color:#fff;font-size:14px;text-align:center;font-weight:bold;">文件下载中请稍后......</span> </div> <!-- 关闭弹出层 --> <div align="center" id="closeDiv" style="display:none;margin-top:-40px;height:80px;position:absolute;width:299px; overflow:hidden;background:#fff;border: 1px solid #087bb4; left:50%;top:50%;font:12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif;lin-height:25px;z-index:9999999;margin-left:-150px;"> <h4 id="msgTitle" onclick="closeDiv();" style="background:#20AAE5;padding:3px;margin:0px;text-align:right;height:18px;color:#fff;cursor:pointer;">[x]</h4> <p align="center" id="msgTxt" style="margin: 1em 0px; padding-left: 5px; padding-right: 5px;color:#666666;font-size:14px;font-weight:bold;">下载完成</p> </div>
2、点击“下载文件到本地”按钮时触发事件以及后续处理事件:
PS:1、JS中有关使用JS获取U盘信息的功能请参考“获取磁盘信息并扫描是否连接移动磁盘之JS版”
2、代码中有关文件下载的代码参考自这里。
var tt = 2 *1000;//2秒扫描一次 var interval=null; var fso = null; var tt2 = 2 *1000;//2秒扫描一次 var downInterval=null;//文件下载扫描 var currentDisk=null;//当前正在使用的磁盘 //该方法用来从服务器下载文件到U盘 function downFileToUpan(){ //1、先检测是否连接到U盘 var diskArr = getDiskInfo(1,1); if(diskArr.length<=0){//说明没有连接U盘 alert("请先插入磁盘"); return false; }else if(diskArr.length>1){//说明至少有2块U盘 alert("检测到有"+diskArr.length+"块磁盘,请先清除其他磁盘确保只有一块可移动磁盘\n清除之后请重新刷新该页面"); return false; }else{ currentDisk = diskArr[0]; var availableSpace = getDiskSpace(currentDisk.AvailableSpace,1,2);//以GB为单位的U盘剩余容量 var fileTotalSize = $("#fileTotalSize").text();//所选文件总大小 //alert(typeof(availableSpace)+"\t"+typeof fileTotalSize); availableSpace = parseFloat(availableSpace);//将字符串转换成浮点数 fileTotalSize = parseFloat(fileTotalSize); //alert(typeof(availableSpace)+"\t"+typeof fileTotalSize); fileTotalSize +=fileTotalSize*0.05;//添加10%的剩余空间,避免出现空间不足的情况 if(availableSpace-fileTotalSize>=0){//剩余空间比文件总大小要大(可以等于,因为还留有5%的剩余空间) $("#zhegai").show();//遮盖层 $("#msgDiv").show();//稍后框 //从服务器端下载文件 getFileFromServer(); }else{ alert("磁盘空间不够"); return false; } } } /** * 该方法用来从服务器上下载文件 * **/ var xh=null; function getFileFromServer(){ var url="MainServlet?time="+new Date().getTime(); xh = InitAjax(); xh.onreadystatechange = getReady; xh.open("GET", url, true); xh.send(); } //获取XMLHttpRequest对象 function InitAjax(){ var ajax=null; if(window.ActiveXObject){ var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP']; try { for(var i=0; i <versions.length; i++) { ajax = new ActiveXObject(versions[i]); if(ajax) {return ajax;} } }catch(e){} }else if(window.XMLHttpRequest) { ajax = new XMLHttpRequest(); } return ajax; } //该方法用来下载文件 function getReady() { if(xh.readyState == 4){ if(xh.status == 200 || xh.status == 0) { var fileName = fileIsExists(currentDisk.Path); saveFile(fileName);//保存文件到本地 return true; }else{return false;} }else {return false;} } //该方法将文件下载到本地 function saveFile(tofile) { var objStream; var imgs; imgs = xh.responseBody; objStream = new ActiveXObject("ADODB.Stream"); objStream.Type = 1; objStream.open(); objStream.write(imgs); //将文件流保存到指定目录 objStream.SaveToFile(tofile); //检测文件是否下载完毕 downloadFinish(tofile); } /** * 该方法用来判断文件给定的文件目录对应的文件是否存在,若存在则重新命名文件名称并判断是否存在,若还是存在,则继续重命名,否则返回文件名称 * @param systemPath:盘符根目录 * */ function fileIsExists(systemPath){ var count = 1;//用来计数 var date = new Date(); var fileName = date.getFullYear()+""+(date.getMonth()+1)+""+date.getDate(); var filespec = systemPath+"\\"+"下载文件("+fileName+").zip"; if(fso==null){fso=new ActiveXObject("Scripting.FileSystemObject");} while(fso.FileExists(filespec)){//文件存在 count++; filespec = systemPath+"\\"+"下载文件("+fileName+")("+count+").zip"; } return filespec; } /** * 该方法用来判断文件是否下载完成 * @param downFile:需要进行判断的文件 * ***/ function downloadFinish(downFile){ //alert("文件路径:"+downFile); if(fso==null){fso=new ActiveXObject("Scripting.FileSystemObject");} if(!fso.FileExists(downFile)){//不存在,也就是还没有下载完成 downInterval = window.setInterval("downloadFinish(downFile)",tt2);//3秒判断一次重复加载 }else{//已经存在,也就是下载完成了 clearInterval(downInterval);//清除定时器 window.setTimeout(function(){//3秒之后关闭 //alert("下载完成");//需要添加定时自动关闭弹出框的功能 $("#msgDiv").hide();//提示“正在下载”的弹出框关闭 $("#closeDiv").show();//显示下载完成提示框 downInterval = window.setTimeout("closeDiv()",5000);//若是不手动关闭,那么3秒后自动关闭 },tt2); } } /** * 点击“关闭弹出框”中的[x]时触发该事件,该事件用来关闭弹出层 * */ function closeDiv(){ $("#closeDiv").hide();//下载完成提示框 $("#zhegai").hide();//遮盖层 clearInterval(downInterval);//清除定时器 window.location.href="login.jsp";//跳转到首页 }
注: 在创建ActiveXObject的时候,可能会碰到“automation服务器不能创建对象”的问题,大家可以去网上搜一下解决办法,也可以参考这里。
3、服务器端处理请求的servlet代码:
//1、查找要下载的文件 List<SFile> fileList = services.getFileList();//下载所有的文件 if(fileList!=null && fileList.size()>1){//最后一个为文件总大小 //2、添加压缩包信息 String zipName = System.currentTimeMillis()+"";//以当前时间为名称 String zipFilePath = com.tzj.tsp.util.WebAppConfig.app("zipPath"); if(zipFilePath==null || zipFilePath.trim().length()<=0){//说明没有设置值 zipFilePath = request.getRealPath(""+java.io.File.separator+"")+"zip"; } zipFilePath =zipFilePath+java.io.File.separator+zipName; File zip = new File(zipFilePath); if(!zip.isDirectory()){//指定目录不存在则新建 zip.mkdir(); } //3、将文件拷贝到压缩包中 File fileLoad = null; File toLoadFile = null;//复制的文件 SFile file = null;//要复制的文件 for(int i=0;i<fileList.size()-1;i++){ file = fileList.get(i); fileLoad = new File(file.getFilePath()); //System.out.println((i+1)+"、"+fileLoad); //确保文件存在再添加 if(fileLoad.exists() && fileLoad.isFile()){ toLoadFile = new File(zip+java.io.File.separator+file.getFileName()); //System.out.println(toLoadFile); toLoadFile = renameFile(toLoadFile); FileUtils.copyFile(fileLoad,toLoadFile);//将fileLoad复制到压缩文件夹中 } } //4、打压缩包 File zipFile = new File(zipFilePath+".zip"); compress(zipFilePath,zipFile); //5、提供下载 fileDown(zipFile,response); zipFile.delete();//5、删除文件 FileUtils.deleteDirectory(zip);//删除目录 } /** * 该方法用来文件重命名 * @param renameFile:要进行重命名的文件 * **/ private File renameFile(File renameFile){ //该文件在指定的文件夹中不存在了,则退出循环 int count=1; String filePath = "";//文件路径 String fileName="";//文件名称 int index=0; while(renameFile.exists()){ count++; fileName = renameFile.getName(); index = fileName.lastIndexOf("."); filePath = renameFile.getParent()+File.separator+fileName.substring(0,index)+"("+count+")."+fileName.substring(index); renameFile = new File(filePath); } return renameFile; } /** * 打压缩包 * @param srcPathName:需要打成压缩包的文件夹路径 * @param zipFile:压缩包名称(路径+名称+.+后缀名) * */ public void compress(String srcPathName,File zipFile) { File srcdir = new File(srcPathName); if (!srcdir.exists()){ throw new RuntimeException(srcPathName + "不存在!"); } if(zipFile.exists()){//说明当前目录下存在同名压缩文件 zipFile.delete(); } Project prj = new Project(); Zip zip = new Zip(); zip.setEncoding("GBK");//设置编码,防止压缩文件名字乱码,还有被压缩文件的乱码 zip.setProject(prj); zip.setDestFile(zipFile); FileSet fileSet = new FileSet(); fileSet.setProject(prj); fileSet.setDir(srcdir); zip.addFileset(fileSet); zip.execute(); //执行生成 } /** * 进行下载 * @param file:File对象,需要进行下载的对象 * */ public void fileDown(File downFile,HttpServletResponse response){ try{ if (!downFile.exists()) throw new Exception("没有找到您需要的资源:" + downFile.getName()+"!"); FileInputStream in = new FileInputStream(downFile); response.setHeader("Content-Disposition","attachment;filename="+ new String(downFile.getName().getBytes("GBK"),"ISO-8859-1")); OutputStream outputStream = response.getOutputStream(); int i = 0; byte b[] = new byte[1024]; while ((i = in.read(b)) != -1) {//读取ZIP文件 outputStream.write(b, 0, i);//写入到页面提供下载 } outputStream.flush(); outputStream.close(); outputStream=null; response.flushBuffer(); }catch(Exception e){ e.printStackTrace(); } }