简介
正常使用jquery上传附件时data传到后端的数据只能是一个对象，
而图片在数据库和bean里面都是存的字符串类型，但是后端接收的是一个文件类型，
这样就上传不到后端，为了解决这个问题，我们就使用 FormData 对象来上传附件
解决方法
配置Spring文件
不配置这个就上传不了文件，一定要配置
<!-- 配置multipartResolver，用于上传文件，使用spring的CommonsMultipartResolver --> <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="maxInMemorySize" value="5000000"></property> <property name="defaultEncoding" value="UTF-8"></property> </bean>
HTML-form表单代码
enctype="multipart/form-data"一定要添加，要不上传不了附件
要上传的地方的input的type属性要改为file来上传文件，并且name属性要改的和bean不一样
<form action="/student/add" method="post" id="addForm" enctype="multipart/form-data"> 姓名：<input type="text" name="name"><br> 家庭住址：<input type="text" name="bigname"><br> 出生日期：<input type="text" name="riqi"><br> 班级：<select name="gradeId"> <option value="0">请选择</option> <option value="1">一年级</option> <option value="2">二年级</option> <option value="3">三年级</option> </select><br> 年龄：<input type="text" name="age"><br> 图片：<input type="file" id="tupianURL" name="tupianURL"><br> <input type="submit" value="添加"> </form>
jquery代码
创建 FormDate 对象来把数据上传到后端，要指定一个form，会获取到form中的数据
切记ajax中 processData: false和contentType: false 一定要记得添加，不添加的话会跳转页面
$("#addForm").submit(function (){ var formData = new FormData(document.getElementById("addForm")); $.ajax({ url:"/student/add", type:"post", data:formData, dataType:"json", processData: false, contentType: false, success:function (data){ if (data>=1){ alert("添加成功"); }else { alert("添加失败"); } } }) return false; })
Controller后端代码
要确保webapp中创建的有这个路径
@RequestMapping("/add") @ResponseBody public String add(Student student,MultipartFile tupianURL,HttpServletRequest request){ if (tupianURL.getSize()>0) {//判断上没上传文件 String fileType=tupianURL.getOriginalFilename(); int index=fileType.lastIndexOf("."); fileType=fileType.substring(index); String path=request.getSession().getServletContext().getRealPath("static"+ File.separator+"uploadfiles"); long filename=System.currentTimeMillis();//获取当前时间时间戳 File file=new File(path+"\\"+filename+fileType); try { tupianURL.transferTo(file); } catch (IOException e) { e.printStackTrace(); } student.setTupian(filename+fileType); } int count=studentService.addStudent(student); String result=JSON.toJSONString(count); return result; }
以上工作作完就可以使用ajax方式上传附件啦！
