本文对接上篇文章《 layui.js实现多文件上传前端html写法总结》,后台和前端html的url的对应及相关参数可参考此文章
此功能实现所用的框架为springboot
代码如下:
@ResponseBody
@RequestMapping({"/demp/model/uploadAreaFile.do"})
public JSONObject uploadAreaFile(@RequestParam(value = "file", required = false) MultipartFile file, HttpServletRequest request) throws Exception {
String schoolId = request.getParameter("schoolId");//获取参数
Map result = new HashMap();
try{
//上传文件方法,这里需要改成自己项目里上传文件方法
String filePath = FileUploadUtil.uploadFile(file, Const.MODEL_FILE_TYPE);
result.put("code", 0);
result.put("msg", "上传成功");
result.put("filePath", filePath);
return JSONObject.fromObject(result);
}catch(Exception e){
result.put("code", -1);
result.put("msg", "上传失败");
result.put("filePath", "");
return JSONObject.fromObject(result);
}
}
最开始实现这个功能遇到几个问题,现总结下来:
1.程序不会到后台,页面一直报接口上报异常,查了下主要是两个原因:
(1)此处的返回值要是json格式的,像本文中返回JSONObject 或 Map
(2)按照(1)改了之后发现还是不可以,后来查资料发现,方法前要引入注解@ResponseBody
按照上面2个步骤改了之后,发现程序成功进入后台
@ResponseBody的原理可参考《浅析@ResponseBody注解作用和原理》,《layUI框架中文件上传前后端交互及遇到的相关问题》
2.关于大于1M的文件后台接口报异常不是因为layui控件的问题,应该是对应项目框架的原因,因为本人用的框架为springboot,查询资料后在项目对应的application.properties文件里加下面两行代码就可以了
spring.http.multipart.maxFileSize=100Mb
spring.http.multipart.maxRequestSize=500Mb
maxFileSize 是单个文件大小,maxRequestSize是设置总上传的数据大小,单位根据自己需求定义,Mb和Kb都可以
3.按照上面方法即layui上传文件后台获取的file参数为null,而且参数也传不过去,最后找到了原因,因为本人用的是springboot框架,发现启动项目类里多了这样一段注解:@EnableAutoConfiguration(exclude = {MultipartAutoConfiguration.class}),就是因为这个导致的原因,去了注解之后就没有这两个问题了,如果不去的话可以通过下面的方式获取file,但是参数还是没有找到方法传到后台。
@ResponseBody
@RequestMapping({"/demp/model/uploadAreaFile.do"})
public JSONObject uploadAreaFile(@RequestParam(value = "file", required = false) MultipartFile file, HttpServletRequest request) throws Exception {
//通过下面的方法获取file
MultipartResolver resolver = new CommonsMultipartResolver(request.getSession().getServletContext());
MultipartHttpServletRequest multipartRequest = resolver.resolveMultipart(request);
file = multipartRequest.getFile("file");
String schoolId = request.getParameter("schoolId");//获取参数
Map result = new HashMap();
try{
//上传文件方法,这里需要改成自己项目里上传文件方法
String filePath = FileUploadUtil.uploadFile(file, Const.MODEL_FILE_TYPE);
result.put("code", 0);
result.put("msg", "上传成功");
result.put("filePath", filePath);
return JSONObject.fromObject(result);
}catch(Exception e){
result.put("code", -1);
result.put("msg", "上传失败");
result.put("filePath", "");
return JSONObject.fromObject(result);
}
}