【Java】SpringMVC实现多张图片上传实例
2017-05-24 14:23
676 查看
实现在Springmvc中上传图片功能很好实现。需求是将多张或单张图片上传至某个文件夹下,同时保存在数据库中和服务器上。现在我将会展现完整例子。
1、前提:在pom中添加相关的jar包。
代码:
3. 在上传按钮时js代码:
附上配置文路径文件:
你也可以自定义该路径的。
1、前提:在pom中添加相关的jar包。
<!-- https://mvnrepository.com/artifact/commons-fileupload/commons-fileupload --> <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.3.2</version> </dependency>2、SpringMVC 用的是 的MultipartFile来进行文件上传 所以我们首先要配置MultipartResolver:用于处理表单中的file。在applicationContext-mvc.xml中添加如下代码:
代码:
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <!-- set the max upload size10MB --> <property name="maxUploadSize"> <value>10485760</value> </property> <property name="maxInMemorySize"> <value>4096</value> </property> <property name="defaultEncoding"> <value>utf-8</value> </property> </bean>
3. 在上传按钮时js代码:
/** * 点击添加图片 * 上传 多张图片 * 原生写法 * @param im * @returns */ function uploadimgforlist(im){ var fileTid = $(".ant-checkbox-checked[name=imgsubcheckbox]").children().eq(0).val();//获取文件夹的id if(typeof(fileTid) != "undefined"){ var path = imgpathchange(im); var file_name = $("input[name='fileImg']"); var addimg='<li>' +'<div class="uploadimg position-rv" onmouseover="showBtnImg(this)" onmouseout="hideBtnImg(this)">' +'<form id="formId" enctype="multipart/form-data" method="post">'//action="../../file/toUpLoadBacthHmImage.do?tid='+fileTid+'" +'</form>' /*+ '<img src="'+path+'">' + '<div id="" class="position-ab imghandle dpnone">' + '<i class="iconfont icon-download" onclick="downloadThisImage(this);"></i>' + '<i class="iconfont icon-delete pull-right deleteimgsigle" onclick="deleteimgsigle(this)"></i>' + '</div>'*/ +'</div>' +'</li>'; $("#imgshowlist").append(addimg); $("#formId").append(file_name); var options = { url: '../../file/toUpLoadBacthHmImage.do', type: "post", dataType: 'json', data:{tid:fileTid}, success:function(data){ if(data.result == true){ alert("上传成功"); location.reload(); }else { alert("上传失败"); } }, error:function(data,msg){ $.error("上传信息失败" + msg); } } $("#formId").ajaxSubmit(options); }else { alert("请先选择文件夹,在进行添加图片!"); } }4、实现上传功能的Controller类方法:
/** * 多张图片上传(含单张) * @param request * @param response * @param model * @return * @author zhangsq */ @RequestMapping("/toUpLoadBacthHmImage.do") public @ResponseBody Map<String, Object> toUpLoadBacthHmImage(HttpServletRequest request, HttpServletResponse response,ModelMap model,String tid, @RequestParam("fileImg") MultipartFile[] multipartfiles) throws IllegalStateException, IOException{ Map<String, Object> map = new HashMap<String, Object>(); HmFile fileBean = hmFileService.findByTidFilesInfo(tid); /** 得到图片保存目录的真实路径 **/ String realpath = properties.getProperty("file.acpath.server"); /** 构建图片保存的目录 **/ String filedir =File.separator + SpellUtil.getFirstSpell(fileBean.getFileName()); String filelocationdir = realpath + filedir; /** 根据真实路径创建目录 **/ File logoSaveFile = new File(filelocationdir); if (!logoSaveFile.exists()){ logoSaveFile.mkdirs(); } boolean doFlag; if(null != multipartfiles && multipartfiles.length > 0){ //MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request; //List<MultipartFile> iter = multiRequest.getFiles("file"); try { for(MultipartFile picFile : multipartfiles){ //MultipartFile picFile = multiRequest.getFile(iter.next()); if(null != picFile && null != picFile.getOriginalFilename() && !"".equals(picFile.getOriginalFilename().trim()) && !"null".equals(picFile.getOriginalFilename().trim())){ synchronized(HmFileImageController.this){ String imagename = new SimpleDateFormat("yyyyMMddHHmmss") .format(new Date()).concat(picFile.getOriginalFilename()); String filename = filelocationdir + File.separator +imagename; File file = new File(filename); picFile.transferTo(file);//上传至服务器 //将文件图片插入数据库 HmImage imgBean = new HmImage(); imgBean.setTid(UUIDUtil.getUUID()); imgBean.setHid(tid); long curTimeStamp = System.currentTimeMillis(); String fileACPath = properties.getProperty("file.acpath.views.server"); String spell = SpellUtil.getFirstSpell(fileBean.getFileName()); fileACPath=String.format(fileACPath,spell,imagename,curTimeStamp); imgBean.setFilePath(fileACPath); //imgBean.setFilePath(fileACPath.replaceAll("/", "\\\\")); String tid_insert = hmImagesService.insertSelective(imgBean);//保存在数据库中 hmFileService.updateByTidUpdateTimes(tid);//更新文件夹的时间 map.put("tid_insert", tid_insert); } } } doFlag = true; } catch (IllegalStateException e) { e.printStackTrace(); doFlag = false; } catch (IOException e) { e.printStackTrace(); doFlag = false; } //遍历并保存文件 map.put("result", doFlag); } return map; }tid:是某个文件夹的id。该功能实现了多张图片上传,一是可以将图片保存在数据库(存储图片的路径),二是将图片存储在服务器上。
附上配置文路径文件:
file.acpath.server=/home/weihu/img_resource/school_web <---- 服务器路径 file.acpath.views.server=http://www.zxctinfo.com:8080/school_web_img/%s/%s?t=%s <---- 数据库路径
你也可以自定义该路径的。
相关文章推荐
- java struts中实现上传多张图片代码
- JAVA 使用springMVC 上传多张图片或文件,并对图片进行按比例缩放处理
- java通过commons-fileupload实现多张图片的上传(jsp页面)
- java通过模拟post方式提交表单实现图片上传功能实例
- java通过commons-fileupload实现多张图片的上传(servlet)
- Java实现的图片上传工具类完整实例
- java实现图片上传至本地实例详解
- java模拟表单上传文件,java通过模拟post方式提交表单实现图片上传功能实例
- jquery.Jcrop结合JAVA后台实现图片裁剪上传实例
- JAVA技术实现上传图片水印效果
- PHP实例解析:实现给上传图片加水印图案
- JAVA实现图片下载至本地,处理后,再上传FTP
- javascript实现上传图片并预览的效果代码实例
- PHP实例解析:实现给上传图片加水印图案
- PHP实例:实现给上传图片加水印图案
- JavaWeb中struts2实现文件上传下载功能实例解析
- JAVA实现图片下载至缓存处理后,再上传FTP
- ASP.NET(C#)实现一次性动态上传多张图片(多个文件)
- ASP.NET(C#)实现一次性上传多张图片(多个文件)
- ASP.NET(C#)实现一次性上传多张图片(多个文件)