Spring MVC 使用介绍（十四）文件上传下载
一、概述
文件上传时，http请求头Content-Type须为multipart/form-data，有两种实现方式：
1、基于FormData对象，该方式简单灵活
2、基于<form>表单元素，method设为POST，enctype设置为multipart/form-data，在form表单上提交
web容器收到该请求时，须根据请求头将字节流解析为文件对象，spring mvc 提供了MultipartResolver、MultipartFile两个接口用于支持文件上传功能
二、MultipartResolver & MultipartFile
1、MultipartResolver接口提供了文件解析功能，其定义如下：
public interface MultipartResolver { boolean isMultipart(HttpServletRequest request); MultipartHttpServletRequest resolveMultipart(HttpServletRequest request) throws MultipartException; void cleanupMultipart(MultipartHttpServletRequest request); }
Spring MVC使用Apache Commons fileupload技术实现了一个MultipartResolver实现类：CommonsMultipartResolver
2、MultipartFile接口代表上传的文件，提供了文件操作的相关功能，其定义如下：
public interface MultipartFile { String getName(); String getOriginalFilename(); // 原文件名 String getContentType(); boolean isEmpty(); long getSize(); byte[] getBytes() throws IOException; InputStream getInputStream() throws IOException; // 获取文件流 void transferTo(File dest) throws IOException, IllegalStateException; // 保存文件 }
三、使用示例
1、添加pom依赖
<dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.4</version> </dependency>
2、spring-mvc.xml中配置MultipartResolver
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <!-- 上传文件大小限制，单位为字节-10Mb --> <property name="maxUploadSize"> <value>10485760</value> </property> <!-- 请求的编码格式 --> <property name="defaultEncoding"> <value>UTF-8</value> </property> </bean>
3、controller
@Controller public class FileController { /** * 文件存储目录 */ private static final String uploadFolder = "d:/upload-file/"; /** * 上传 */ @ResponseBody @RequestMapping(value = "/upload", method = RequestMethod.POST) public Map<String, String> fileUpload(@RequestParam("file") MultipartFile file, @RequestParam("fileType") String fileType) throws Exception { // 创建文件目录 SimpleDateFormat sdf = new SimpleDateFormat("yyyyMM"); String dateStr = sdf.format(new Date()); String dirPath = uploadFolder + dateStr; File dir = new File(dirPath); if (!dir.exists()) { dir.mkdirs(); } // 保存文件 String fileName = UUID.randomUUID() + this.getFileNameSuffix(file.getOriginalFilename()); File savedFile = new File(dir + "/" + fileName); file.transferTo(savedFile); Map<String, String> result = new HashMap<String, String>(); result.put("fileName", file.getOriginalFilename()); result.put("fileType", fileType); result.put("filePath", dateStr + "/" + fileName); return result; } /** * 下载 */ @RequestMapping("/download") public void downloadFile(@RequestParam(value = "fileName", required = false) String fileName, @RequestParam("filePath") String filePath, HttpServletResponse response) throws Exception { File file = new File(uploadFolder + filePath); if (!file.exists()) { return; } // 读取字节流到缓存 InputStream in = new BufferedInputStream(new FileInputStream(file)); byte[] buffer = new byte[in.available()]; in.read(buffer); in.close(); // 设置ContentType String suff = this.getFileNameSuffix(file.getName()); if (suff != null) { suff = suff.toLowerCase(); } switch (suff) { case ".jpg": case ".jpeg": response.setContentType(MediaType.IMAGE_JPEG_VALUE); break; case ".png": response.setContentType(MediaType.IMAGE_PNG_VALUE); break; case ".gif": response.setContentType(MediaType.IMAGE_GIF_VALUE); break; default: response.setContentType(MediaType.APPLICATION_OCTET_STREAM_VALUE); break; } // 输出 response.addHeader("Content-Disposition", "attachment;filename=\"" + (StringUtils.isEmpty(fileName) ? file.getName() : fileName)); response.addHeader("Content-Length", "" + file.length()); response.setContentType("application/x-msdownload"); OutputStream out = new BufferedOutputStream(response.getOutputStream()); out.write(buffer); out.flush(); } /** * 获取文件名后缀*/ private String getFileNameSuffix(String fileName) { if (StringUtils.isEmpty(fileName)) { return null; } String suffix; int index = fileName.lastIndexOf("."); if (index == -1) { suffix = null; } else { suffix = fileName.substring(index); } return suffix; } }
4、前端页面（test.html）
<!DOCTYPE html> <html> <head> <title>test page</title> </head> <body> <div> <input id="upload" type="file" onchange="uploadFile(event)" /> </div> <div> <input id="download" type="button" onclick="downloadFile()" value="下载" /> </div> </body> <script> var context = '/test' function uploadFile(event) { // 文件类型过滤 var file = event.currentTarget.files[0]; var fileName = file.name; if (/\.(jpg|jpeg|png|gif)$/i.test(fileName) == false) { alert('提示', '不支持的图片类型，头像只支持.jpg,.jpeg,.png,.gif'); return; } var formData = new FormData(); formData.append('fileType', 'portrait'); formData.append('file', event.currentTarget.files[0]); // 发送请求 var xhr = new XMLHttpRequest(); xhr.open('POST', context + '/upload', true); xhr.onreadystatechange = function() { if (xhr.readyState==4 && xhr.status==200) { document.getElementById('download').fileData = JSON.parse(xhr.responseText); alert("上传成功"); } } xhr.send(formData); // 重置文件上传控件，使得重复选择同一个文件时，onchange依旧触发 event.target.value = null; } function downloadFile() { var fileData = document.getElementById('download').fileData; location.href = context + '/download?filePath=' + decodeURIComponent(fileData.filePath) + '&fileName=' + decodeURIComponent(fileData.fileName); } </script> </html>
访问http://file-test/test.html，可测试文件的上传下载功能
补充：示例使用@ResponseBody输出json数据，因此还需添加相关配置，详细可参考Spring MVC 使用介绍（五）—— 注解式控制器（一）：基本介绍
另外，文件下载除了示例中文件流方式，还可以基于spring对静态文件的支持功能，详细可参考Spring MVC 使用介绍（十一）—— 跨域与静态资源访问
参考：
