依赖jar:
<!-- 上传文件所需jar包--> <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.3.3</version> </dependency> <dependency> <groupId>commons-io</groupId> <artifactId>commons-io</artifactId> <version>2.4</version> </dependency>
上传前台代码:
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>Title</title> </head> <script type="text/javascript"> function handleFile(f) { var files = f.files; if (files.length > 9) { alert("同时最多只能上传9个文件！"); f.value = null; return false; } var result = ""; for (var i = 0; i < files.length; i++) { result += "文件名：" + files[i].name; result += "文件大小：" + files[i].size; result += "文件类型：" + files[i].type; if (files[i].size > 1024 * 1024 * 10) {//限定上传的文件中，单个大小不可超过10M alert("单个文件不可大于10Mb！"); //如果超过10M，则文件清空 f.value = null; } } /* alert(result); */ } </script> <body> <%-- form的enctype="multipart/form-data" （默认值是：application/x-www-form-uxlencoded） enctype:是表单请求正文的类型 --%> <form action="fileUploadController/fileUploadtest" method="post" enctype="multipart/form-data"> 名称: <input type="text" name="text"><br> <%-- multiple="multiple"设置一次可以选择多个文件 accept="..."设置可选择的文件类型 accept="image/png" or accept=".png" ~~~~~ 只接受 png 图片. accept="image/png, image/jpeg" or accept=".png, .jpg, .jpeg" ~~~~~ 只接受PNG/JPEG 文件. accept="image/*"~~~~~ 接受任何图片文件类型. accept=".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" ~~~~~接受任何 MS Doc 文件类型. --%> 图片:<input type="file" name="file" multiple="multiple" accept="image/png,image/gif,image/jpeg, image/jp2,.txt" onchange="handleFile(this)"><br> <%-- 我们也可以写多个input上传多个不同种类的文件--%> <%-- 图片2: <input type="file" name="file2"><br>--%> <%-- 图片3: <input type="file" name="file3"><br>--%> <input type="submit"><br> </form> </body> </html>
上传后台代码:
@RequestMapping("/fileUploadController")
@Controller("fileUploadController")
public class _07FileUploadController {
@RequestMapping("/fileUploadtest")
public ModelAndView fileUploadtest(HttpServletRequest request) throws Exception {
ModelAndView modelAndView = new ModelAndView();
ArrayList<String> filenameList = new ArrayList<String>();
//1.判断表单是否支持文件上传
boolean multipartContent = ServletFileUpload.isMultipartContent(request);
if (!multipartContent) {
// 可以返回错误页面,也可以抛异常
modelAndView.setViewName("error");
return modelAndView;
}
//2.创建DiskFileItemFactory对象
DiskFileItemFactory factory = new DiskFileItemFactory();
/**
* setRepository:设置缓存文件的目录（commons-fileupload是使用缓存的。
* 原则：大小是否超过10kb。如果超过10kb则使用临时文件作为缓存）
* 如果不超过10KB则使用内存作为缓存
* 如果下面这行代码没有配置,则默认使用tomcat目录作为缓存目录
*/
// factory.setRepository(new File("D:\\temp"));
//3.创建ServletFileUpload对象,//设置上传文件限制
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setFileSizeMax(1024 * 1024 * 10);//1024个kb等于1Mb，最终设置结果是10Mb
upload.setHeaderEncoding("utf-8");//设置编码格式
// 4.解析request，得到FileItem对象的集合
List<FileItem> fileItems = upload.parseRequest(request);
//5.判断FileItem是否文件字段
for (FileItem fileItem : fileItems) {
//6.不是文件：打印输出
if (fileItem.isFormField()) {//是普通表单字段
String fieldName = fileItem.getFieldName();//普通字段字段名
String fileValue = fileItem.getString("UTF-8");//普通字段字段值
System.out.println(fieldName + "," + fileValue);
} else {//是文件：写文件
//获取文件名
String name = fileItem.getName();
// 拼接新的文件名
String uuid = UUID.randomUUID().toString().replace("-", "").toUpperCase();
String newName = uuid + System.currentTimeMillis() + name;//8BDC8C7F743548A9863FA01755E8256515944355054110.jpg
filenameList.add(newName);
modelAndView.addObject("fileNameList", filenameList);
// 创建新的文件夹用来存放上传文件
File file = new File("D:\\fileUpload");
if (!file.exists()) {
file.mkdir();
}
// 如果使用服务器内部路径可以按照下面的方式写:
// String path = request.getServletContext().getRealPath("/WIB-INF/uploads");
// 从缓冲区写入磁盘
fileItem.write(new File(file, newName));
// 从缓冲区删除
fileItem.delete();
System.out.println("文件上传成功!!!");
}
}
//8.释放流
System.out.println("上传执行了");
modelAndView.setViewName("fileUpLoadShow");
return modelAndView;
}
}
展示图片页:
所需依赖:
<!-- jstl标签--> <dependency> <groupId>javax.servlet</groupId> <artifactId>jstl</artifactId> <version>1.2</version> </dependency>
所需配置:
tomcat配置虚拟路径:参考:https://www.cnblogs.com/luzhanshi/p/13285349.html
fileUpLoadShow.jsp代码:
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>Title</title> </head> <body> <c:forEach items="${fileNameList}" var="name"> <img src=‘/images/${name}‘ alt="图片加载失败"><br> ${name} </c:forEach> </body> </html>
最终效果: