项目中经常遇到包含图片的表单提交问题。我们的做法是提交图片在服务器下的路径地址。
使用layui框架实现文件上传流程如下;
选择图片,将图片传至后台保存到指定文件夹下。
后台向前台返回图片在服务器下的路径地址。
前台将获得的地址填入隐藏控件中随着表单一起提交到后台。
这样以来,表单提交的就不再是图片,而是简单的图片地址。
前端页面
品牌:
尺码:
预览图一:
上传图片
确定
js
后台代码
@RequestMapping("/upload")
@ResponseBody
public Mapupload(@RequestParam MultipartFile file,HttpServletRequest request){
//保存上传
OutputStream out = null;
InputStream fileInput=null;
try{
if(file!=null){
String filepath = request.getServletContext().getRealPath("/")+"jsp\\images\\picture.png";
File files=new File(filepath);
//打印查看上传路径
System.out.println("filepath:"+filepath);
if(!files.getParentFile().exists()){
files.getParentFile().mkdirs();
}
file.transferTo(files);
Mapmap=new HashMap<>();
map.put("code",0);
map.put("msg","");
map.put("src",filepath);
return map;
}
}catch (Exception e){
}finally{
try {
if(out!=null){
out.close();
}
if(fileInput!=null){
fileInput.close();
}
} catch (IOException e) {
}
}
Mapmap=new HashMap<>();
map.put("code",1);
map.put("msg","");
return map;
}