先展示效果
需要两个jar包
commons-fileupload-1.3.2.jar
commons-io-2.5.jar
- 首先在 web.xml 中新增加一段
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.jpg</url-pattern>
<url-pattern>*.png</url-pattern>
</servlet-mapping>
表示允许访问*.jpg,*.png。
为什么要加这一段呢? 因为配置 springmvc 的 servlet 的时候,使用的路径是"/",导致静态资源在默认情况下不 能访问,所以要加上这一段,允许访问 jpg。 并且必须加在 springmvc 的 servlet 之前 .如果你配置 spring-mvc 使用的路径是/*.do,就不会有这个问题了
- 在springmvc.xml中添加以下代码,开放对上传功能的支持。不添加会报npe!!
<!-- id 必须是 multipartResolver,内部绑定好,不能改动 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"/>
- 上传页面主要代码
<body>
<form action="uploadImage" method="post" enctype="multipart/form-data">
选择图片:<input type="file" name="image" accept="image/*" /><br>
<input type="submit" value="上传">
</form>
</body>
上传页面,需要注意的是 form 的两个属性必须提供 method=“post” 和 enctype=“multipart/form-data” 缺一不可 上传组件 增加一个属性 accept="image/*“表示只能选择图片进行上传,表示会选择所有图片类型 留意 < input type=“file” name=“image” accept="image/” /> 这个 image,后面会用到这个 image
- 准备一个工具类UploadedImageFile
这里的字段 image 必须和上传页面 upload.jsp 中的 image < input type=“file” name="image" accept=“image/*” /> 保持一致
public class UploadedImageFile {
MultipartFile image;
public MultipartFile getImage() {
return image;
}
public void setImage(MultipartFile image) {
this.image = image;
}
}
- 新建 UploadController 上传控制器
@Controller
public class UploadController {
@RequestMapping("/uploadImage")
public ModelAndView upload(HttpServletRequest request, UploadedImageFile file) throws IllegalStateException, IOException {
// 获取随机文件名
//RandomStringUtils类导入jar包位置 https://mvnrepository.com/artifact/org.apache.struts.xwork/xwork-core/2.2.1
String name = RandomStringUtils.randomAlphanumeric(10);
// 获取原有文件名称(包括文件类型)
String fileName = file.getImage().getOriginalFilename();
// 截取文件类型
int indexdot = fileName.indexOf(".");
String suffix = fileName.substring(indexdot);
// 创建文件,给文件起名字
String newFileName = name + suffix;
// 创建 File 对象,并设定存放位置和存放文件的文件名
File newFile = new File(request.getServletContext().getRealPath("/image"), new FileName); // 调用 newFile 这个实例的 getParentFile 方法, 返回它的父目录对象的实例,得到父目录实 例后,接着调用.mkdirs()(是父目录这个实例调用的),创建文件夹。
newFile.getParentFile().mkdirs();
// 复制文件,把图片写入磁盘
file.getImage().transferTo(newFile); ModelAndView mav = new ModelAndView("showUploadedFile");
mav.addObject("imageName", newFileName); return mav;
}
}
- 最后一步,添加返回界面
<body> <img alt="" src="image/${imageName }"> </body>
总结:
1.用到的RandomStringUtils这个类好像很久了,只有老版本才支持,我用的 xwork-core2.21下载地址
2.图片上传地址是其实是在你配置 Tomcat 那个 server.xml 配置的路径的项目下的 image 文件夹中。 注意不是上传到项目中