java与jquery.uploadify实现文件上传

首先前端的页面要引入两个js文件和jQuery.js(要先引入jQuery.js才能在引入uploadify的js),

 

<script type="text/javascript" src="./js/jquery.js"></script> 

<script type="text/javascript" src="./js/uploadify/swfobject.js"></script>
<script type="text/javascript" src="./js/uploadify/jquery.uploadify.v2.1.4.js"></script>

 

<script type="text/javascript">
$(function(){

     //图片上传
    $("#picFile").uploadify( {//初始化函数
        'uploader': '${ctx }/js/uploadify/uploadify.swf',        
        'cancelImg': '${ctx }/js/uploadify/cancel.png',           
        'script' :'${ctx }/servlet/FileUpLoad',//后台处理的请求
        'queueID' :'maxQueue',//与下面的上传文件列表id对应
        'queueSizeLimit' :1,//上传文件的数量
       // 'scriptData':{'a':'value1','b':'value2'},//向后台传的数据
        'fileDesc' :'jpg,png,gif,bmp,jepg',//上传文件类型说明
        'fileExt' :'*.jpg;*.png;*.gif;*.bmp;*.jepg', //控制可上传文件的扩展名，启用本项时需同时声明fileDesc
        //'method':'get',//如果向后台传输数据，必须是get
        'sizeLimit':30000000,//文件上传的大小限制，单位是字节
        'auto' :true,//是否自动上传
        'multi' :false,
        //'simUploadLimit' :1,//同时上传文件的数量
        //'buttonText' :'BROWSE',//浏览按钮图片
        'buttonImg': '${ctx }/ui/frame/images/ps.jpg',
        'heigth'         :20,            
        'width'          : 50,
        'onSelect': function(e, queueId, fileObj){  
            $("#picPath").val(fileObj.name);    
        }
       });
    
});
</script>

下面是上传文件的工能按钮

      <tr>
              <th>图片新闻：</th>
              <td>
                 <input type="text" id="picPath" name="picPath" value="${oATouchColumn.picPath}" readonly="readonly"/>
                 <input type="file" id="picFile" name="picFile" value="浏览"/>
              </td>
        </tr>

 

然后是文件上传的后台代码是一个serlvet

package com.vingsoft.hardware.util;

import java.io.File;
import java.io.IOException;
import java.util.Iterator;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.FileUploadException;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;

/**
 * 文件上传 文件路径规则：tomcat下项目名+temp文件夹+用户ID文件夹+文件名
 * 
 * @author huzj
 * @describe
 * 
 */
@SuppressWarnings("serial")
public class FileUpLoad extends HttpServlet {

    @SuppressWarnings("unchecked")
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        String savePath = this.getServletConfig().getServletContext()
                .getRealPath("");
        savePath = savePath + File.separator + "userfiles/uploadFile" + File.separator;
        File f1 = new File(savePath);
        if (!f1.exists()) {
            f1.mkdirs();
        }

        DiskFileItemFactory fac = new DiskFileItemFactory();
        ServletFileUpload upload = new ServletFileUpload(fac);
        upload.setHeaderEncoding("utf-8");
        List fileList = null;
        try {
            fileList = upload.parseRequest(request);
        } catch (FileUploadException ex) {
            return;
        }
        Iterator<FileItem> it = fileList.iterator();
        String name = "";
        String extName = "";
        while (it.hasNext()) {
            FileItem item = it.next();
            if (!item.isFormField()) {
                name = item.getName();
                name = updateFileName(name);
                long size = item.getSize();
                String type = item.getContentType();
                System.out.println(size + " " + type);
                if (name == null || name.trim().equals("")) {
                    continue;
                }

                // 扩展名格式：
                if (name.lastIndexOf(".") >= 0) {
                    extName = name.substring(name.lastIndexOf("."));
                }

                File file = null;
                do {
                    // 生成文件名：
                    // name = UUID.randomUUID().toString();
                    // file = new File(savePath + name + extName);
                    file = new File(savePath + name);
                } while (file.exists());
                // File saveFile = new File(savePath + name + extName);
                File saveFile = new File(savePath + name);
                try {
                    item.write(saveFile);
                } catch (Exception e) {
                    e.printStackTrace();

                }

            }

        }

        response.getWriter().print(name);
    }

    // 给上传的文件重新命名，防止重名
    public String updateFileName(String name) {
        /*
         * String rename = name.substring(0,
         * name.lastIndexOf("."))+System.currentTimeMillis();
         */
        String rename = name.substring(0, name.lastIndexOf("."));
        String extName = name.substring(name.lastIndexOf("."));
        return rename + extName;
    }
}
 

最后要在项目下的web.xml中添加路径配置,其中的内容要按照自己项目去改

  <servlet>
    <javaee:description>This is the description of my J2EE component</javaee:description>
    <javaee:display-name>This is the display name of my J2EE component</javaee:display-name>
    <servlet-name>FileUpLoad</servlet-name>
    <servlet-class>com.vingsoft.hardware.util.FileUpLoad</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>FileUpLoad</servlet-name>
    <url-pattern>/servlet/FileUpLoad</url-pattern>
  </servlet-mapping>

写好后点击上传按钮文件就会自动的上传了

文件所需的js等在审核,为uploadify.zip,用的时候可点作者的资源进去看看是否审核好了