Struts2+JQuery.uploadify插件实现带进度的多文件上传示例【也可以设置去掉进度条的显示】

最新推荐文章于 2021-11-20 19:27:12 发布

buster2014

最新推荐文章于 2021-11-20 19:27:12 发布

阅读量1.1k

点赞数

分类专栏：常见实际问题解决

常见实际问题解决专栏收录该内容

67 篇文章 0 订阅

订阅专栏

本文介绍如何使用Struts2实现文件上传和下载功能，包括上传文件的Action编写、配置文件struts2.xml的设置以及上传界面的JSP页面实现。详细解释了文件上传过程中的关键步骤，如获取上传文件、保存文件路径和处理文件类型。同时展示了如何在JSP页面集成上传组件，提供直观的用户界面，并实现了文件下载功能。

摘要由CSDN通过智能技术生成

文章来源：http://blog.csdn.net/tujiyue/article/details/6537842

备注：如果不需要进度条的话，可以在uploadify.css文件中每个模块里添加：【display: none;】即可；

文件下载Action：

/** 
 * Struts2Test 
 * 顺便的文件下载的Action 
 */  
package com.labci.struts2.action;  
import java.io.FileInputStream;  
import java.io.InputStream;  
import java.io.OutputStream;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
import org.apache.struts2.interceptor.ServletRequestAware;  
import org.apache.struts2.interceptor.ServletResponseAware;  
import com.opensymphony.xwork2.ActionSupport;  
/** 
 * @author Bill Tu(tujiyue/iwtxokhtd) 
 * Jun 8, 2011[9:15:15 PM] 
 * 
 */  
public class DownloadFileAction extends ActionSupport implements  
        ServletRequestAware, ServletResponseAware {  
      
    /** 
     *  
     */  
    private static final long serialVersionUID = -7448748577778248376L;  
    private HttpServletRequest request;  
    private HttpServletResponse response;  
    private String savePath;  
      
    @Override  
    public String execute() throws Exception {  
          
        String fileName=request.getParameter("fileName");  
        String fullPath=getSavePath()+"//"+fileName;  
        fileName=new String(fileName.getBytes("utf-8"),"iso-8859-1");  
        InputStream is=new FileInputStream(fullPath);  
        int len=0;  
        byte []buffers=new byte[1024];  
        response.reset();  
        response.setContentType("application/x-msdownload");  
        response.addHeader("Content-Disposition", "attachment;filename=/""+fileName+"/"");  
          
        //把文件内容通过输出流打印到页面上供下载  
        while((len=is.read(buffers))!=-1){  
            OutputStream os=response.getOutputStream();  
            os.write(buffers, 0, len);  
        }  
          
        is.close();  
          
        return SUCCESS;  
    }  
    public void setServletRequest(HttpServletRequest req) {  
        this.request=req;  
    }  
    public void setServletResponse(HttpServletResponse resp) {  
        this.response=resp;  
    }  
    @SuppressWarnings("deprecation")  
    public String getSavePath() {  
        return request.getRealPath(savePath);  
    }  
    public void setSavePath(String savePath) {  
        this.savePath = savePath;  
    }  
      
}

文件上传Action：

/** 
 * Struts2Test 
 * 使用Struts2上传文件 
 */  
package com.labci.struts2.action;  
import java.io.File;  
import java.io.FileInputStream;  
import java.io.FileOutputStream;  
import java.util.List;  
import javax.servlet.http.HttpServletRequest;  
import org.apache.struts2.interceptor.ServletRequestAware;  
import com.opensymphony.xwork2.ActionSupport;  
/** 
 * @author Bill Tu(tujiyue/iwtxokhtd) 
 * Jun 8, 2011[8:31:01 PM] 
 * 
 */  
public class UploadFileAction extends ActionSupport implements  
        ServletRequestAware {  
    /** 
     *  
     */  
    private static final long serialVersionUID = -1896915260152387341L;  
    private HttpServletRequest request;  
    public void setServletRequest(HttpServletRequest req) {  
        this.request=req;  
    }  
      
      
    private List<File> fileName;//这里的"fileName"一定要与表单中的文件域名相同  
    private List<String> fileNameContentType;//格式同上"fileName"+ContentType  
    private List<String> fileNameFileName;//格式同上"fileName"+FileName  
    private String savePath;//文件上传后保存的路径  
      
    public List<File> getFileName() {  
        return fileName;  
    }  
  
    public void setFileName(List<File> fileName) {  
        this.fileName = fileName;  
    }  
  
    public List<String> getFileNameContentType() {  
        return fileNameContentType;  
    }  
  
    public void setFileNameContentType(List<String> fileNameContentType) {  
        this.fileNameContentType = fileNameContentType;  
    }  
  
    public List<String> getFileNameFileName() {  
        return fileNameFileName;  
    }  
  
    public void setFileNameFileName(List<String> fileNameFileName) {  
        this.fileNameFileName = fileNameFileName;  
    }  
  
    @SuppressWarnings("deprecation")  
    public String getSavePath() {  
        return request.getRealPath(savePath);  
    }  
  
    public void setSavePath(String savePath) {  
        this.savePath = savePath;  
    }  
    @Override  
    public String execute() throws Exception {  
        File dir=new File(getSavePath());  
        if(!dir.exists()){  
            dir.mkdirs();  
        }  
        List<File> files=getFileName();  
        for(int i=0;i<files.size();i++){  
            FileOutputStream fos=new FileOutputStream(getSavePath()+"//"+getFileNameFileName().get(i));  
            FileInputStream fis=new FileInputStream(getFileName().get(i));  
            byte []buffers=new byte[1024];  
            int len=0;  
            while((len=fis.read(buffers))!=-1){  
                fos.write(buffers,0,len);  
            }  
        }  
        return SUCCESS;  
    }  
  
}

struts2.xml

<?xml version="1.0" encoding="UTF-8" ?>  
<!DOCTYPE struts PUBLIC  
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"  
    "http://struts.apache.org/dtds/struts-2.0.dtd">  
<struts>  
    <constant name="struts.devMode" value="false" />  
    <!-- 改变struts2默认为2M的上传文件大小限制 -->  
    <constant name="struts.multipart.maxSize" value="1024000000"/>  
    <package name="upload" extends="struts-default">  
        <action name="uploadFile" class="com.labci.struts2.action.UploadFileAction">  
            <param name="savePath">/upload</param>  
            <result name="success">index.jsp</result>  
        </action>  
        <action name="downloadFile" class="com.labci.struts2.action.DownloadFileAction">  
            <param name="savePath">/upload</param>  
            <result name="success">index.jsp</result>  
        </action>  
    </package>  
</struts>

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" 
	xmlns="http://java.sun.com/xml/ns/javaee" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
	<!-- org.apache.struts2.dispatcher.FilterDispatcher -->
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
  <filter>
  	<filter-name>struts2</filter-name>
  	<filter-class>
  		org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter  
  	</filter-class>
  </filter>
  <filter-mapping>
  	<filter-name>struts2</filter-name>
  	<url-pattern>*.action</url-pattern>
  </filter-mapping></web-app>

jsp页面【去掉了原文章中的自定义标签 mce:script后】：

<%@ page language="java" contentType="text/html;charset=utf-8" pageEncoding="utf-8"%>  
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
  <head>  
    <title>Struts2结合JQuery.uploadify实现带进度的多文件上传示例</title>  
   
    <link href="js/uploadify.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath() %>/js/swfobject.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery.uploadify.v2.1.4.min.js"></script>  
    <script type="text/javascript" >
        $(function() {  
            $("#cancelBtn").hide();  
            $("#full").hide();  
            $('#strutsUploadFile').uploadify({  
             	  'uploader'  : 'js/uploadify.swf',//进度条动画  
                  'script'    : 'uploadFile.action',  
                  'cancelImg' : 'js/cancel.png',  
                  'fileDataName':'fileName',  
                  //解决中文按钮名的好方式  
                  'buttonImg' : 'images/select.jpg',  
                  //可选  
                  'height'    : 20,  
                  //可选  
                  'width'     : 50,  
                  //设置允许上传的文件格式  
                  //'fileExt'   : '*.jpg;*.gif;*.png',  
                  //设置允许上传的文件格式后，必须加上下面这行代码才能帮你过滤  
                  //'fileDesc'    : 'Image Files',  
                  //允许连续上传多个文件  
                  'multi':'true',  
                  //一次性最多允许上传多少个,不设置的话默认为999个  
                  'queueSizeLimit' : 2,  
                  //每个文件允许上传的大小(字节)  
                  //'sizeLimit'   : 102400,  
                  'onComplete'  : function(event, ID, fileObj, response, data) {  
                        //当每个文件上传完成后的操作  
                        $("#cancel").hide();  
                        $("#full").hide();  
          	$("#show").append( "<a href=downloadFile.action?fileName="+fileObj.name+">"+fileObj.name+"</a><br/>");  //下载文件 
                        },  
                  'onAllComplete':function(event,data) {  
                        //当所有文件上传完成后的操作  
                        $("#cancelBtn").hide();  
                        if(data.errors==0){  
                            $("#allShow").append("所有文件已上传成功(本次共上传"+data.filesUploaded+"个),上传总大小:"+data.allBytesLoaded+"字节,平均传输速度："+data.speed+"KB/s");  
                        }else{  
                            $("#allShow").append("成功上传"+data.filesUploaded+"个文件，失败"+data.errors+"个,上传总大小:"+data.allBytesLoaded+"字节,平均传输速度："+data.speed+"KB/s");  
                        }  
                  },  
                  'onOpen': function(event,ID,fileObj) {  
                        //当有文件正在上传时的操作  
                        $("#cancelBtn").show();  
                  },  
                  'onQueueFull': function (event,queueSizeLimit) {  
                        //当添加待上传的文件数量达到设置的上限时的操作  
                        $("#full").append("<font color='red'><b>已经达到上传数量限制了,不能再添加了</b></color><br/>");  
                        $("#full").show();  
                        return false;  
                  },  
                  'onCancel': function(event,ID,fileObj,data) {  
                        //当取消所有正在上传文件后的操作  
                        $("#cancelBtn").hide();  
                  }  
            });               
        });  
      
 	</script>      
  </head>  
    
  <body>  
    <div id="full"></div>  
    <div id="allShow"></div>  
    <div id="show"></div>  
    <input type="file"  name="fileName" id="strutsUploadFile"/><br/>    
    <input type="button" οnclick="javascript:$('#strutsUploadFile').uploadifyUpload()" value="确定上传"/>  
     <input type="button" id="cancelBtn" οnclick="javascript:$('#strutsUploadFile').uploadifyClearQueue()" value="取消上传"/>  
  </body>  
</html>