背景
SpringBoot，2.3.9.RELEASE，表单上传文件，案例代码。
案例
后台代码
package com.what21.demo.controller; import lombok.extern.slf4j.Slf4j; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.multipart.MultipartFile; import org.springframework.web.multipart.MultipartHttpServletRequest; import javax.servlet.http.HttpServletRequest; import java.io.File; import java.io.IOException; import java.util.HashMap; import java.util.List; import java.util.Map; import java.util.Set; @Controller @RequestMapping("/upload") @Slf4j public class FileUploadController { @RequestMapping(value = "/show", method = {RequestMethod.GET, RequestMethod.POST}) @ResponseBody public Object show(HttpServletRequest request) { Map<String, Object> dataMap = new HashMap<>(); dataMap.put("code", "ok"); dataMap.put("status", "success"); return dataMap; } @RequestMapping(value = "/multiUpload", method = {RequestMethod.GET, RequestMethod.POST}) @ResponseBody public Object multiUpload(HttpServletRequest request) { Map<String, Object> dataMap = new HashMap<>(); dataMap.put("code", "ok"); // ===================================================================================// // ===== 解析参数&保存文件 // ===================================================================================// String storagePath = "D:/Temp/Upload/"; // 多文件 MultipartHttpServletRequest multipartHttpRequest = (MultipartHttpServletRequest) request; Map<String, MultipartFile> multipartFileMap = multipartHttpRequest.getFileMap(); Set<String> keySet = multipartFileMap.keySet(); for (String key : keySet) { MultipartFile multipartFile = multipartFileMap.get(key); if (multipartFile.isEmpty()) { continue; } String fileName = multipartFile.getOriginalFilename(); try { File dest = new File(storagePath + fileName); multipartFile.transferTo(dest); } catch (IOException e) { e.printStackTrace(); } } // ===================================================================================// // ===== 返回结果 // ===================================================================================// return dataMap; } @RequestMapping(value = "/multiUpload2", method = {RequestMethod.GET, RequestMethod.POST}) @ResponseBody public Object multiUpload2(HttpServletRequest request) { Map<String, Object> dataMap = new HashMap<>(); dataMap.put("code", "ok"); // ===================================================================================// // ===== 解析参数&保存文件 // ===================================================================================// String storagePath = "D:/Temp/Upload/"; // 多文件 MultipartHttpServletRequest multipartHttpRequest = (MultipartHttpServletRequest) request; List<MultipartFile> multipartFileList = multipartHttpRequest.getFiles("files"); String filePath = storagePath; for (int i = 0; i < multipartFileList.size(); i++) { MultipartFile file = multipartFileList.get(i); if (file.isEmpty()) { continue; } String fileName = file.getOriginalFilename(); File dest = new File(filePath + fileName); try { file.transferTo(dest); } catch (IOException e) { e.printStackTrace(); } } // ===================================================================================// // ===== 返回结果 // ===================================================================================// return dataMap; } }
配置类：
/** * 允许不规范 URL 访问 * @return */ @Bean public HttpFirewall httpFirewall() { return new DefaultHttpFirewall(); }
前端代码：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Form表单上传</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.1/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div class="container " style="width:600px;"> <span> <h1>Form表单上传</h1> </span> <form method="post" action="http://localhost:8001/demo02/upload/multiUpload" enctype="multipart/form-data"> <input type="hidden" name="model" value="object" /> <div class="form-group"> <label for="address">上传地址:</label> <input id="address" name="address" class="form-control" value="http://localhost:8001/demo02/upload/multiUpload" /> </div> <div class="form-group"> <label for="modular">一级模块:</label> <input id="modular" name="modular" class="form-control" value="modular"/> </div> <div class="form-group"> <label for="model">二级模块:</label> <input id="model" name="model" class="form-control" value="model" /> </div> <div class="form-group"> <label for="file1">上传文件1:</label> <input id="file1" type="file" name="file" value="" class="form-control" /> </div> <div class="form-group"> <label for="file2">上传文件2:</label> <input id="file2" type="file" name="file2" value="" class="form-control" /> </div> <div class="form-group"> <label for="desc">描述:</label> <textarea id="desc" name="desc" class="form-control" style="min-height: 200px;"></textarea> </div> <div class="form-group form-check"> <label class="form-check-label"> <input class="form-check-input" type="checkbox">记住我 </label> </div> <button type="reset" class="btn btn-secondary">取消</button> <button type="submit" class="btn btn-danger">提交</button> </form> </div> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Form表单上传</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.1/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div class="container " style="width:600px;"> <span> <h1>Form表单上传</h1> </span> <form method="post" action="http://localhost:8001/demo02/upload/multiUpload2" enctype="multipart/form-data"> <input type="hidden" name="model" value="object" /> <div class="form-group"> <label for="address">上传地址:</label> <input id="address" name="address" class="form-control" value="http://localhost:8001/demo02/upload/multiUpload2" /> </div> <div class="form-group"> <label for="modular">一级模块:</label> <input id="modular" name="modular" class="form-control" value="modular"/> </div> <div class="form-group"> <label for="model">二级模块:</label> <input id="model" name="model" class="form-control" value="model" /> </div> <div class="form-group"> <label for="file1">上传文件1:</label> <input id="file1" type="file" name="file" value="" class="form-control" /> </div> <div class="form-group"> <label for="file2">上传文件2:</label> <input id="file2" type="file" name="file" value="" class="form-control" /> </div> <div class="form-group"> <label for="desc">描述:</label> <textarea id="desc" name="desc" class="form-control" style="min-height: 200px;"></textarea> </div> <div class="form-group form-check"> <label class="form-check-label"> <input class="form-check-input" type="checkbox">记住我 </label> </div> <button type="reset" class="btn btn-secondary">取消</button> <button type="submit" class="btn btn-danger">提交</button> </form> </div> </body> </html>
还没有评论，来说两句吧...