SpringMVC+Huploadify 实现文件上传下载
实现上传下载的技术有很多，我目前做的这个项目视图层用的SpringMVC框架，需要结合该框架实现上传下载。
问了下公司前辈，前端框架推荐我使用Huploadify。
不多说，上代码。
js代码，函数调用：
①首先要下载引用js，这个不赘述。
②函数引用
1 function uploadInit(domName,domPic){ 2 $("#"+domName).Huploadify({ 3 auto:true, 4 fileTypeExts:'*.*', //前缀、后缀拦截（多个,隔开） 5 multi:false, //是否上传多个 6 fileObjName:'fileid', //参数名称（***重点***） 7 fileSizeLimit:99999999999, //文件大小限制（单位kb） 8 showUploadedPercent:true, //是否显示上传进度条 9 buttonText:'上传图片', //上传按钮显示文字 10 uploader:"${ctx}/advance/account/upload", //控制器路径 11 onUploadSuccess:function(file,data){ 12 alert("上传成功"); 13 var Data=JSON.parse(data); 14 if(Data.success==true){ 15 $("#"+domPic).attr("src",Data.result); 16 param.uploadsuccess(Data.result); 17 }else{ 18 jQuery.longhz.alert(Data.resultDes); 19 } 20 }, 21 onUploadError:function(file,response){ 22 jQuery.longhz.alert("上传失败!"); 23 } 24 }); 25 26 } 27 28 29 //调用公共方法 30 uploadInit("fileid","imgid");
③HTML
1 <div class="col-sm-4 controls"> 2 <img src="" alt="" class="" id="imgid"/>预览图片 3 <div id="fileid" name="fileid"></div><!--图片上传按钮--> 4 </div>
好了，完事了。。。
就是这么简单，补充两点：
1.Huploadify包中有个jquery.Huploadify.js文件，其中包含齐全的默认配置，可以再里面更改属性。
2.注意fileObjName:'fileid'这个参数，这个参数表示传递给控制器的参数名称，这个值必须在页面配置——jquery.Huploadify.js文件——控制器接受参数三者一致，否则会出现接收不到请求或参数错误的情况。
控制器代码：
1 //上传图片 2 @RequestMapping(value = "upload") 3 public void upload(@RequestParam(value="fileid") MultipartFile file) { 4 if(file == null) return; 5 String fileName = file.getOriginalFilename(); 6 File saveFile = new File(Global.getConfig("uploadPath")+fileName); 7 UploadUtils.copy(file, saveFile); 8 9 } 10 11 //以流的形式存储到本地即可 12 public class UploadUtils { 13 public static void copy(MultipartFile file, File saveFile){ 14 OutputStream os = null; 15 InputStream is = null; 16 int i = 0; 17 byte[] buff = new byte[1024]; 18 try { 19 os = new FileOutputStream(saveFile); 20 is = file.getInputStream(); 21 while((i = is.read(buff)) != -1) 22 os.write(buff, 0, i); 23 os.flush(); 24 } catch (FileNotFoundException e) { 25 // TODO Auto-generated catch block 26 e.printStackTrace(); 27 } catch (IOException e) { 28 // TODO Auto-generated catch block 29 e.printStackTrace(); 30 }finally{ 31 try { 32 is.close(); 33 os.close(); 34 } catch (IOException e) { 35 // TODO Auto-generated catch block 36 e.printStackTrace(); 37 } 38 } 39 } 40 }
配置文件：
1 <!-- 上传文件拦截，设置最大上传文件大小 10M=10*1024*1024(B)=10485760 bytes --> 2 <bean > 3 <property name="maxUploadSize" value="${web.maxUploadSize}" /> 4 </bean>