挤点时间出来记录下,今天遇到自己完成上传表单里面有文件的上传用ajax完成(前提是表单有这个属性enctype=“multipart/form-data”,提交方法位post),下面是我用spring boot搭的环境的解决办法:
首先表单里面是有文件上传的:
<input type="file" class="text" name="file" /><span></span>
然后去到ajax写:
//这里的formData比较关键
var formData = new FormData($("#productAdd")[0]);
$.ajax({
//controller地址
url: contextPath+"/product/addProduct" ,
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
dataType:"json",
success: function (data) {
//成功的回调
if(data.status == 1){
alert("添加成功");
location.href=contextPath+"/backend/product";
}
else{
alert("添加失败");
}
},
error: function (returndata) {
//请求异常的回调
modals.warn("网络访问失败,请稍后重试!");
}
});
最后后台接收:
//这里的关键是springmvc给我们提供的MultipartFile接口,可以接收多文件表单上传
@RequestMapping("/addProduct")
@ResponseBody
public String addProduct(Product product,@RequestParam(value="file") MultipartFile file) {
int num=0;
try {
//得到上传的文件名,有后缀的,只限图片
String fileName1 = file.getOriginalFilename();
//得到.前的字符串
String securityStr = fileName1.substring(0, fileName1.indexOf("."));
//给字符串加密
String fileStr1 = MD5Util.getMD5(securityStr);
//得到.后的字符串
String fileStr2 = fileName1.substring(fileName1.indexOf("."));
//加密后的文件名
String fileName2=fileStr1+fileStr2;
//我们要把图片保存到服务器上,而不是硬盘上
String pathLujin=ProductController.class.getResource("/static/files").toString();
//得到完整的文件名,因为上面的pathLujin会有file:/这个前缀,所以需要去掉
File lastFile=new File(pathLujin.substring(5),fileName2);
System.out.println("\n\n这时图片的存放位置:"+lastFile);
//将完整的文件读到硬盘
file.transferTo(lastFile);
//最后获得刚从前台上传到硬盘的文件名字,有后缀的
String filename = lastFile.getName();
//将加密好而且上传到硬盘的文件名set到product对象中
product.setFilename(filename);
num = productService.addProduct(product);
} catch (NoSuchAlgorithmException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalStateException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return num>0?"{\"status\":\"1\"}":"{\"status\":\"2\"}";
}
好了,解决了。