每次使用时都去百度,还是留个笔记吧
在pom.xml添加springmvc的依赖,在pom.xml添加
<!-- https://mvnrepository.com/artifact/commons-fileupload/commons-fileupload -->
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.2</version>
</dependency>
使用springmvc上传文件时一般流程为
1、 在 表单提交方式:post
2、 表单编码格式:multipart/form-data
例如:
<form action="./upload/file0.do" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" value="upload"/>
</form>
3、 上传文件名一controller对应方法MultipartFile参数名相同
例如:
<input type="file" name="picture"/>
public ModelAndView upload(MultipartFile picture)
4、 配置图片解析器
如果form表单上添加enctype=”multipart/form-data”,而springmvc.xml中没有配置multipart解析器,此时其它类型参数(pojo,基本类型)都不能绑定成功。所以,主要只要form中有enctype=”multipart/form-data”配置,必须要springmvc.xml中配置multipart解析器
applicationContext.xml添加如下:
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="maxUploadSize" value="10485760" />
</bean>
案例
uploadfile.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>uploadfile0.jsp</title>
</head>
<body>
<form action="./upload/file0.do" method="post" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" value="upload"/>
</form>
</body>
</html>
package com.ttpay.testpay.controller;
import java.io.File;
import java.io.IOException;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
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.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;
@Controller
@RequestMapping("/upload")
public class UploadController {
private static Log log = LogFactory.getLog(UploadController.class);
@RequestMapping(value="file0",method=RequestMethod.POST)
public String upload0(@RequestParam MultipartFile file,HttpServletRequest request, HttpServletResponse response) throws IOException {
log.info("uploadController... file0()...");
String path = request.getSession().getServletContext().getRealPath("upload");
File file0 = new File(path, file.getOriginalFilename());
file.transferTo(file0); // 保存文件
return "/success";
}
@RequestMapping(value="file1", method=RequestMethod.POST)
public String upload1(HttpServletRequest request, HttpServletResponse response) {
log.info("uploadController... file1()...");
String path = request.getSession().getServletContext().getRealPath("upload");
MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest) request;
Map<String, MultipartFile> map = multipartHttpServletRequest.getFileMap();
log.info("path:" + path);
File file = new File(path);
if (!file.exists()) {
file.mkdirs();
}
try {
for (Map.Entry<String, MultipartFile> entity : map.entrySet()) {
MultipartFile multipartFile = entity.getValue();
File ff = new File(path, multipartFile.getOriginalFilename());
multipartFile.transferTo(ff);
}
return "/success";
} catch (Exception e) {
e.printStackTrace();
return "/error";
}
}
}
其实上面是文件上传接受文件的2种方式,一种是二进制,一种是包装类。
多文件上传:
多文件上传前端部分
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="../js/jquery-1.7.2.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
i = 1;
j = 1;
$(document).ready(function(){
$("#btn_add1").click(function(){
document.getElementById("newUpload1").innerHTML+='<div id="div_'+i+'"><input name="file" type="file" /><input type="button" value="删除" onclick="del_1('+i+')"/></div>';
i = i + 1;
});
$("#btn_add2").click(function(){
document.getElementById("newUpload2").innerHTML+='<div id="div_'+j+'"><input name="file_'+j+'" type="file" /><input type="button" value="删除" onclick="del_2('+j+')"/></div>';
j = j + 1;
});
});
function del_1(o){
document.getElementById("newUpload1").removeChild(document.getElementById("div_"+o));
}
function del_2(o){
document.getElementById("newUpload2").removeChild(document.getElementById("div_"+o));
}
</script>
</head>
<body>
<h1>springMVC字节流输入上传文件</h1>
<form name="userForm1" action="/springMVC7/file/upload" enctype="multipart/form-data" method="post">
<div id="newUpload1">
<input type="file" name="file">
</div>
<input type="button" id="btn_add1" value="增加一行" >
<input type="submit" value="上传" >
</form>
<br>
<br>
<hr align="left" width="60%" color="#FF0000" size="3">
<br>
<br>
<h1>springMVC包装类上传文件</h1>
<form name="userForm2" action="/springMVC7/file/upload2" enctype="multipart/form-data" method="post"">
<div id="newUpload2">
<input type="file" name="file">
</div>
<input type="button" id="btn_add2" value="增加一行" >
<input type="submit" value="上传" >
</form>
</body>
</html>
多文件上传后端部分:
@RequestMapping("/upload3" )
public String upload3(@RequestParam("file") CommonsMultipartFile[] files,HttpServletRequest request){
for(int i = 0;i<files.length;i++){
System.out.println("fileName---------->" + files[i].getOriginalFilename());
if(!files[i].isEmpty()){
int pre = (int) System.currentTimeMillis();
try {
//拿到输出流,同时重命名上传的文件
FileOutputStream os = new FileOutputStream("H:/" + new Date().getTime() + files[i].getOriginalFilename());
//拿到上传文件的输入流
FileInputStream in = (FileInputStream) files[i].getInputStream();
//以写字节的方式写文件
int b = 0;
while((b=in.read()) != -1){
os.write(b);
}
os.flush();
os.close();
in.close();
int finaltime = (int) System.currentTimeMillis();
System.out.println(finaltime - pre);
} catch (Exception e) {
e.printStackTrace();
System.out.println("上传出错");
}
}
}
return "/success";
}
@RequestMapping("/upload4" )
public String upload4(HttpServletRequest request,HttpServletResponse response) throws IllegalStateException, IOException {
//创建一个通用的多部分解析器
CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(request.getSession().getServletContext());
//判断 request 是否有文件上传,即多部分请求
if(multipartResolver.isMultipart(request)){
//转换成多部分request
MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest)request;
//取得request中的所有文件名
Iterator<String> iter = multiRequest.getFileNames();
while(iter.hasNext()){
//记录上传过程起始时的时间,用来计算上传时间
int pre = (int) System.currentTimeMillis();
//取得上传文件
MultipartFile file = multiRequest.getFile(iter.next());
if(file != null){
//取得当前上传文件的文件名称
String myFileName = file.getOriginalFilename();
//如果名称不为“”,说明该文件存在,否则说明该文件不存在
if(myFileName.trim() !=""){
System.out.println(myFileName);
//重命名上传后的文件名
String fileName = "demoUpload" + file.getOriginalFilename();
//定义上传路径
String path = "H:/" + fileName;
File localFile = new File(path);
file.transferTo(localFile);
}
}
//记录上传该文件后的时间
int finaltime = (int) System.currentTimeMillis();
System.out.println(finaltime - pre);
}
}
return "/success";
}
这里给一个使用jquery-uploadify上传文件的使用方式,使用的是flash版,uploadify-3.2.1
testUploadify.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="./jslib/uploadify/uploadify.css" rel="stylesheet" type="text/css" />
<script src="./jslib/jquery/jquery-3.2.1.js" type="text/javascript"></script>
<script src="./jslib/uploadify/jquery.uploadify.js" type="text/javascript"></script>
<script src="./jslib/swfobject.js" type="text/javascript"></script>
<style type="text/css">
#fileQueue {position: absolute;bottom: 0;right: 0;}
</style>
<title>uploadfile.jsp</title>
</head>
<body>
<form id="form1">
spring mvc 上传文件<br>
<div id="fileQueue">
</div>
<input type="file" name="uploadify" id="uploadify" />
<p>
<a href="javascript:$('#uploadify').uploadify('upload','*')">上传</a>|
<a href="javascript:$('#uploadify').uploadify('cancel')">取消上传</a>
</p>
</form>
</body>
<script>
$(function(){
$('#uploadify').uploadify({
'auto': false,
'method':'post',
'swf':'./jslib/uploadify/uploadify.swf',
'uploader':'./upload/file1.do',
'buttonText': '上传图片',
'fileTypeDesc': 'Image Files',
'fileTypeExts': '*.gif; *.jpg; *.png',
'formData': { 'someKey': 'someValue'},
'queueID': 'fileQueue',
'multi': false
});
});
</script>
</html>
uploadify文档:http://www.uploadify.com/documentation/
参考学习了:http://blog.csdn.net/a1314517love/article/details/24183273