changsongzi 2013-02-20
首先需要使用的uploadify插件,包含以下几个主要文件
jquery.min.js(uploadify3.2使用的是jquery-1.7.2.版本)
jquery.uploadify.min.js(开发建议使用jquery.uploadify.js)
uploadify.swf
uploadify.css
在页面中引入相关的js和css文件
<script src="${ctx}/static/jquery/uploadify/jquery.min.js" type="text/javascript"></script> <script src="${ctx}/static/jquery/uploadify/jquery.uploadify.min.js" type="text/javascript"></script> <link rel="stylesheet" type="text/css" href="${ctx}/static/jquery/uploadify/uploadify.css">
在页面中的uploadify组件
<h1>Uploadify Demo</h1> <form> <div id="queue"></div> <input id="file" name="file" type="file" multiple="true"> </form>
js部分的操作代码
<script type="text/javascript"> $(function() { $("#file").uploadify({ method : 'post', swf : '${ctx}/static/jquery/uploadify/uploadify.swf', // uploadify.swf在项目中的路径 uploader : '${ctx}/utils/uploadify', // 后台UploadController处理上传的方法 fileObjName : 'file', // The name of the file object to use in your server-side script fileSizeLimit : 0, // The maximum size of an uploadable file in KB (Accepts units B KB MB GB if string, 0 for no limit) successTimeout : 30, // The number of seconds to wait for Flash to detect the server's response after the file has finished uploading removeCompleted : false, // Remove queue items from the queue when they are done uploading fileSizeLimit : '10MB', buttonText : '选择文件', height : 30, width : 120 }); }); </script> <h1>UPLOADIFY DEMO</h1> <div class="controls"> <div id="queue"></div> <input id="file" name="file" type="file" multiple="true"> </div>
在spring-mvc.xml做相应的上传文件配置
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="defaultEncoding"> <value>UTF-8</value> </property> <property name="maxUploadSize"> <value>32505856</value><!-- 上传文件大小限制为31M,31*1024*1024 --> </property> <property name="maxInMemorySize"> <value>4096</value> </property> </bean>
在后台处理文件上传的Controller操作
package com.nnwufang.herosp.web.utils; import java.io.File; import java.io.IOException; import java.text.SimpleDateFormat; import java.util.Date; import java.util.Iterator; import java.util.Map; import java.util.Random; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.validation.Valid; import org.springframework.stereotype.Controller; import org.springframework.util.FileCopyUtils; import org.springframework.web.bind.annotation.PathVariable; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.multipart.MultipartFile; import org.springframework.web.multipart.MultipartHttpServletRequest; import org.springframework.web.multipart.commons.CommonsMultipartFile; import org.springframework.web.multipart.commons.CommonsMultipartResolver; @Controller @RequestMapping(value="/utils") public class UploadController{ /** * 上传文件 * @return * @throws IOException * @throws IllegalStateException */ @RequestMapping(value = "/uploadify", method = RequestMethod.POST) @ResponseBody public String upload(HttpServletRequest request, HttpServletResponse response){ String responseStr=""; MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request; Map<String, MultipartFile> fileMap = multipartRequest.getFileMap(); // 文件保存路径 String ctxPath=request.getSession().getServletContext().getRealPath("/")+File.separator+"uploadFiles"; SimpleDateFormat sdf = new SimpleDateFormat("yyyyMM"); String ymd = sdf.format(new Date()); ctxPath += File.separator + ymd + File.separator; // 创建文件夹 File file = new File(ctxPath); if (!file.exists()) { file.mkdirs(); } String fileName = null; for (Map.Entry<String, MultipartFile> entity : fileMap.entrySet()) { // 上传文件 MultipartFile mf = entity.getValue(); fileName = mf.getOriginalFilename(); String fileExt = fileName.substring(fileName.lastIndexOf(".") + 1).toLowerCase(); // 重命名文件 SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss"); String newFileName = df.format(new Date()) + "_" + new Random().nextInt(1000) + "." + fileExt; File uploadFile = new File(ctxPath + newFileName); try { FileCopyUtils.copy(mf.getBytes(), uploadFile); responseStr="上传成功"; } catch (IOException e) { responseStr="上传失败"; e.printStackTrace(); } } return responseStr; } }
初步学习springside4,在使用uploadify实现文件上传功能的过程中报出了java.lang.NoClassDefFoundError: org/apache/commons/fileupload/FileItemFactory的异常,在项目中导入commons-fileupload-1.2.2.jar问题就解决了。希望对大家有所帮助!