SpringMvc实现文件上传
1.pom文件添加依赖
<!--文件异步上传工具-->
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.4</version>
</dependency>
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.1</version>
</dependency>
2.springmvc.xml配置
把此对象作为一个bean来管理,id的值必须为multipartResolver
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"></bean>
3.使用文件上传
- 前端:使用ajax框架的文件上传插件
ajaxfileupload.js
,使用文件异步上传。使用前导入该js
文件<form action="${pageContext.request.contextPath}/prod/save.action" enctype="multipart/form-data" method="post" id="myform"> <div id="imgDiv" style="display:block; width: 40px; height: 50px;"></div> <input type="file" id="pimage" name="pimage" onchange="fileChange()"> <span id="imgName"></span><br> </form> <script type="text/javascript"> function fileChange() {//注意:此处不能使用jQuery中的change事件,因此仅触发一次,因此使用标签的:onchange属性 alert("change"); $.ajaxFileUpload({ url: '/prod/ajaxImg.action',//用于文件上传的服务器端请求地址 secureuri: false,//一般设置为false fileElementId: 'pimage',//文件上传控件的id属性 <input type="file" id="pimage" name="pimage" /> dataType: 'json',//返回值类型 一般设置为json success: function (obj) //服务器成功响应处理函数 { // alert(obj); $("#imgDiv").empty(); //清空原有数据 //创建img 标签对象 var imgObj = $("<img>"); //给img标签对象追加属性 imgObj.attr("src", "/image_big/" + obj.imgurl); imgObj.attr("width", "100px"); imgObj.attr("height", "100px"); //将图片img标签追加到imgDiv末尾 $("#imgDiv").append(imgObj); //将图片的名称(从服务端返回的JSON中取得)赋值给文件本框 //$("#imgName").html(data.imgName); alert("successful"); }, error: function (e)//服务器响应失败处理函数 { alert(e.message); } }); }
- 后端控制器层:
MultipartFile pimage
是springmvc自动注入的,在前面已经配置过了。这个对象保存了文件的流,文件的上传的原始名称。由于上传的图片可能名称相同,所有对于每个文件的名称,使用uuid随机生成。使用transferTo(File file)
直接保存上传的文件@ResponseBody @RequestMapping("/ajaxImg") //===========文件异步上传=============== //MultipartFile用于接收文件上传的流,在srpingmvc必须配置好 // pimage必须要和文件上传为name值相同 public Object ajaxImg(MultipartFile pimage, HttpServletRequest request){ //获取生成的文件名 saveFileName= FileNameUtil.getUUIDFileName()+ FileNameUtil.getFileType(pimage.getOriginalFilename()); //设置文件保存的路径 String path=request.getServletContext().getRealPath("/image_big"); //转存 D:\后端学习\java\学习教程\米米商城\跟做\mimissm\src\main\webapp\image_big\xxx.jpg try { pimage.transferTo(new File(path+File.separator+saveFileName)); } catch (IOException e) { e.printStackTrace(); } //返回json对象给前端页面 封装了图片的信息 JSONObject jsonObject=new JSONObject(); jsonObject.put("imgurl",saveFileName); return jsonObject.toString(); }
- 随机生成文件的名称,获取文件的后缀的工具类代码如下:
public class FileNameUtil { //根据UUID生成文件名 public static String getUUIDFileName() { UUID uuid = UUID.randomUUID(); return uuid.toString().replace("-", ""); } //从请求头中提取文件名和类型 public static String getRealFileName(String context) { // Content-Disposition: form-data; name="myfile"; filename="a_left.jpg" int index = context.lastIndexOf("="); String filename = context.substring(index + 2, context.length() - 1); return filename; } //根据给定的文件名和后缀截取文件名 public static String getFileType(String fileName){ //9527s.jpg int index = fileName.lastIndexOf("."); return fileName.substring(index); } }