uploadify的使用

Uploadify是一个基于JQuery的文件上传组件，非常容易整合到Web项目中。

功能需求：实现一个个人信息的图片上传功能，点击上传图片按钮后，即可进行上传。

注意：图片每次存为4位随机数+此人的身份证号+".jpg",这是防止重复上传图片后浏览器仍使用图片缓存。

代码如下：

<div style="width:150px;float:left;margin-top:20px;height:300px;">
<div style="width:150px;height:200px;text-align:center;"><img id="myPic" src="" width="148px" height="200px"/></div>
<div style="width:150px;height:100px;font-size:10px;">
<input type="file" name="file_upload" id="file_upload" style="width:148px;height:15px;"/>
</div>
</div>

js脚本为：

<script type="text/javascript">
//初始化
var sfzh;
//照片的路径
var imgurl;
window.οnlοad=function(){

	hbutZpDWR.getSfzhXm(function(dat){
	
		if(dat!="")
		{
			var strs=dat.split("{1}quot;);
			sfzh=strs[0];
			var xm=strs[1];
			//解析生日
			var birthday=sfzh.substring(6,14);
			var showBirth=birthday.substring(0,4)+"-"+birthday.substring(4,6)+"-"+birthday.substring(6,8);
			var gender;
			var temp;
			if(sfzh.length==15)
			{
				temp=sfzh.substring(14,15);
			}
			else if(sfzh.length==18)
			{
			    temp=sfzh.substring(16,17);
			}
			if(parseInt(temp)%2==1)
			{
				gender="男";
			}
			else
			{
			    gender="女";
			}
			document.getElementById("xm").innerHTML=xm;
			document.getElementById("xb").innerHTML=gender;
			document.getElementById("csny").innerHTML=showBirth;
			document.getElementById("sfzh").innerHTML=sfzh;
		}
		$('#file_upload').uploadify({
			'uploader': 'uploadify/uploadify.swf',
    		'script'    : '../../servlet/Upload?id='+sfzh,
    		'cancelImg' : 'uploadify/cancel.png',
    		'folder'    : '/uploads',
    		'auto'      : true,
    		'buttonImg':'img/b_pho.png',
    		'fileExt':'*.jpg;',
    		'fileDesc': 'Image Files',
    		'onComplete':function(event,queueID,fileObj,response,data){
    		
    			alert("上传完成！");
    			imgurl=response;
    		    document.getElementById("mypic").src=response;
    		},
    		'onError':function(event,queueID,fileObj,errorObj){
    		
    			alert(errorObj.info);
    		}
  		});
	});
}

servlet为：

package com.frame.servlet;

import java.io.File;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.*;
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;

public class Upload extends HttpServlet {

	/**
	 * Constructor of the object.
	 */
	public Upload() {
		super();
	}

	/**
	 * Destruction of the servlet. <br>
	 */
	public void destroy() {
		super.destroy(); // Just puts "destroy" string in log
		// Put your code here
	}

	/**
	 * The doGet method of the servlet. <br>
	 *
	 * This method is called when a form has its tag value method equals to get.
	 * 
	 * @param request the request send by the client to the server
	 * @param response the response send by the server to the client
	 * @throws ServletException if an error occurred
	 * @throws IOException if an error occurred
	 */
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		doPost(request,response);
	}

	/**
	 * The doPost method of the servlet. <br>
	 *
	 * This method is called when a form has its tag value method equals to post.
	 * 
	 * @param request the request send by the client to the server
	 * @param response the response send by the server to the client
	 * @throws ServletException if an error occurred
	 * @throws IOException if an error occurred
	 */
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		request.setCharacterEncoding("utf-8");
		response.setCharacterEncoding("utf-8");
		response.setContentType("text/html");
		
		System.out.println("进入Upload servlet");
		String savePath=this.getServletConfig().getServletContext().getRealPath("")+"\\business\\resume\\uploads\\";
		File file=new File(savePath);
		if(!file.exists())
		{
			file.mkdir();
		}
		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=".jpg";
	    String saveName=request.getParameter("id");
	    Random random1=new Random();
	    String sj="";
		while(it.hasNext())
		{
			FileItem item=it.next();
			if(!item.isFormField())
			{
				name=item.getName();
				long size = item.getSize();
	            String type = item.getContentType();
	            System.out.println(size + " " + type);
	            if (name == null || name.trim().equals("")) {
	                    continue;
	            }
	            sj="";
	            for(int i=0;i<4;i++)
	            {
	            	sj+=String.valueOf(random1.nextInt(10));
	            }
	            File saveFile = new File(savePath +sj+ saveName + extName);
	            try {
	                    item.write(saveFile);
	            } catch (Exception e) {
	                    e.printStackTrace();
	            }
			}
		}
		System.out.println(savePath+sj+saveName+extName);
		response.getWriter().print("uploads/"+sj+saveName+extName);
	}

	/**
	 * Initialization of the servlet. <br>
	 *
	 * @throws ServletException if an error occurs
	 */
	public void init() throws ServletException {
		// Put your code here
	}

}

uploadify下载地址：http://download.youkuaiyun.com/detail/rongyongfeikai2/4058578