标签:
1、首先在uploadify官网下载相关的文件,目前有两种类型的,一种是flash(免费),另一种是html5(要收费)
然后部署到项目里
这里需要
uploadify.js
uploadify.min.js
uploadify.css
uploadify-cancel.png
uploadify.swf
当然别忘了添加文件上传时jar包
commons-fileupload.jar和commons-io.jar
2、然后进行初始化
<script type="text/javascript" src="<%=request.getContextPath() %>/js/uploadify/jquery.uploadify.min.js"></script> <script type="text/javascript" src="<%=request.getContextPath() %>/js/uploadify/jquery.uploadify.js"></script> <script type="text/javascript" src="<%=request.getContextPath() %>/js/uploadify/swfobject.js"></script> <link href="<%=request.getContextPath() %>/js/uploadify/uploadify.css"> <script type="text/javascript"> $(function(){ $("#file_upload").uploadify({//上传文件 ‘method‘ : ‘post‘, ‘debug‘:‘true‘,//开发者模式 ‘uploader‘ : ‘upload/‘, //文件上传的请求 ‘swf‘:‘uploadify.swf‘,//动态控件 ‘cancelImg‘ : ‘files/images/css/uploadify-cancel.png‘, //取消图片 ‘queueID‘ : ‘queue‘,//与下面的id对应 文件上传队列显示的地方 ‘fileDesc‘ : ‘rar文件或zip文件‘, ‘fileExt‘ : ‘*.rar;*.zip;*.jpg;*.png;*.exe;*.gif‘, //控制可上传文件的扩展名,启用本项时需同时声明fileDesc ‘auto‘ : false, //是否自动上传 ‘multi‘ : false, //是否多文件上传 ‘simUploadLimit‘ : 2, ‘progressData ‘: ‘percentage‘,//显示上传进度方式 scriptData:{‘name‘:‘value‘} , ‘buttonText‘ : ‘附件xx‘,//文件选择按钮名称 }); });
下面是上传调用,特别是uploadify的上传和取消的函数,在uploadify的不同版本其函数的调用方式也稍有差距
<div id="queue"></div> <input id="file_upload" name="file_upload" type="file" multiple="true"> <p ><a href="javascript:$(‘#file_upload‘).uploadify(‘upload‘, ‘*‘)">上传文件</a>
| <a href="javascript:$(‘#file_upload‘).uploadify(‘stop‘)">停止上传!</a> </p>
@RequestMapping(value="/upload",method=RequestMethod.POST) public void uploadify(@RequestParam("Filedata")MultipartFile multiFile,HttpServletRequest request, HttpServletResponse response) throws IOException, FileUploadException{ System.out.println("上传文件"); System.out.println("name:"+multiFile.getOriginalFilename()); System.out.println("inputstream"+multiFile.getInputStream()); ServletContext sc = request.getSession().getServletContext(); String dir = sc.getRealPath("/upload");//附件存放服务器的路径 System.out.println(dir); File file = new File(dir); if(!file.exists()){ file.mkdirs(); } String filename = multiFile.getOriginalFilename(); String realname = filename.substring(0, filename.indexOf(".")); //防止文件被覆盖,以纳秒生成文件 Long _l = System.nanoTime(); String _extfilename = filename.substring(filename.indexOf(".")); filename = _l+_extfilename; String uploadPath = request.getContextPath()+""+dir+"/"+filename; String responseStr = ""; try { FileUtils.writeByteArrayToFile(new File(dir, filename), multiFile.getBytes()); responseStr = "上传成功!"; } catch (Exception e) { e.printStackTrace(); responseStr = "fail"; System.out.println("上传失败!"); }
}
注意还得在springmvc配置文件弄个resolver,否则文件上传是会报请求找不到流的异常
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="defaultEncoding" value="utf-8"></property> <property name="maxUploadSize" value="104857600"/> </bean> <!-- 该异常是SpringMVC在检查上传的文件信息时抛出来的,而且此时还没有进入到Controller方法中 --> <bean id="exceptionResolver" class="org.springframework.web.servlet.handler.SimpleMappingExceptionResolver"> <property name="exceptionMappings"> <props> <!-- 遇到MaxUploadSizeExceededException异常时,自动跳转到XXX页面 --> <prop key="org.springframework.web.multipart.MaxUploadSizeExceededException">exception/fileuploadexception</prop> </props> </property> </bean>
标签:
原文地址:http://www.cnblogs.com/zhou-789profession/p/4457650.html