简介
基于Servlet3的文件上传
Servlet3将multipart/form-data的POST请求封装成Part,通过Part对上传的文件进行操作。
Servlet3没有提供直接获取文件名的方法,需要从请求头中解析出来请求头的格式:
单个文件上传
<html>
<head>
<title>Servlet3单文件上传</title>
</head>
<body>
<!-- 文件上传时必须设置表单的 enctype="multipart/form-data"-->
<form action="${pageContext.request.contextPath}/singleFileUpload" method="post" enctype="multipart/form-data">
上传文件:<input type="file" name="file"><br>
<input type="submit" value="上传">
</form>
</body>
</html>
基于JQuery的单文件上传的页面
<html>
<head>
<title>$Title$</title>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js"></script>
<script type="text/javascript">
function uploadFile(){
var formData = new FormData();
formData.append("file",$("#file")[0].files[0]);
formData.append("info",'haha');
$.ajax({
url:'${pageContext.request.contextPath}/singleFileUpload', /*接口域名地址*/
type:'post',
data: formData,
contentType: false,
processData: false,
success:function(res){//字符串
console.log(res);
var json = eval('('+res+')');//字符串转JSON
console.log(json.data);
}
})
}
</script>
</head>
<body>
<input type="file" name="file" id="file">
<button onclick="uploadFile()">上传文件</button>
</body>
</html>
后台代码
@MultipartConfig //标识Servlet支持文件上传
@WebServlet(urlPatterns = "/singleFileUpload")
public class SingleFileUploadServlet extends HttpServlet {
@Override
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
String savePath = request.getServletContext().getRealPath("/uploadFile"); //存储路径
File path = new File(savePath);
if(!path.exists()) { //如果路径不存在则创建
path.mkdirs();
}
Collection<Part> parts = request.getParts(); //获取上传的文件集合
if (parts != null && parts.size() == 1) { //上传单个文件
Part part = request.getPart("file"); //通过表单file控件(<input type="file" name="file">)的名字直接获取Part对象
String header = part.getHeader("content-disposition");//获取请求头
String fileName = getFileName(header); //获取文件名
part.write(savePath + File.separator + fileName); //把文件写到指定路径
}
PrintWriter out = response.getWriter();
out.println("上传成功");
out.flush();
out.close();
}
/**
* 根据请求头解析出文件名
* @param header 请求头
* @return 文件名
*/
public String getFileName(String header) {
String[] temp = header.split(";")[2].split("=");
//获取文件名,兼容各种浏览器的写法
String fileName = temp[1].substring(temp[1].lastIndexOf("\\") + 1).replaceAll("\"", "");
return fileName;
}
}
多个文件上传
<html>
<head>
<title>Servlet3多文件上传</title>
</head>
<body>
<!-- 文件上传时必须要设置表单的enctype="multipart/form-data"-->
<form action="${pageContext.request.contextPath}/multiFileUpload" method="post" enctype="multipart/form-data">
上传文件:<input type="file" name="file1"><br>
上传文件:<input type="file" name="file2"><br>
<input type="submit" value="上传">
</form>
</body>
</html>
后台代码
@MultipartConfig//标识Servlet支持文件上传
//使用@WebServlet配置UploadServlet的访问路径
@WebServlet(urlPatterns = "/multiFileUpload")
public class MultiFileUploadServlet extends HttpServlet {
@Override
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
//存储路径
String savePath = request.getServletContext().getRealPath("/uploadFile");
File path = new File(savePath);
if(!path.exists()) {
path.mkdirs();
}
Collection<Part> parts = request.getParts(); //获取上传的文件集合
if (parts != null && parts.size() > 1) { //一次性上传多个文件
for (Part part : parts) {//循环处理上传的文件
String header = part.getHeader("content-disposition");//获取请求头
//获取文件名
String fileName = getFileName(header);
//把文件写到指定路径
part.write(savePath + File.separator + fileName);
}
PrintWriter out = response.getWriter();
out.println("上传成功");
out.flush();
out.close();
}
}
/**
* 根据请求头解析出文件名
* @param header 请求头
* @return 文件名
*/
public String getFileName(String header) {
String[] temp = header.split(";")[2].split("=");
//获取文件名,兼容各种浏览器的写法
String fileName = temp[1].substring(temp[1].lastIndexOf("\\") + 1).replaceAll("\"", "");
return fileName;
}
}
任意多个文件上传
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>动态添加文件上传列表</title>
<script type="text/javascript">
function addFile(event) {
//创建一个div标签,用以包含一个input标签和删除按钮
var innerdiv = document.createElement("div");
//创建一个input标签
var inputNode = document.createElement("input");
inputNode.name = "fileName";
inputNode.type = "file";
//创建一个删除按钮
var delNode = document.createElement("input");
delNode.name = "del";
delNode.type = "button";
delNode.value = "删除";
//删除当前删除按钮所在的标签,为此按钮点击事件创建一个处理函数
delNode.onclick = function d() {
this.parentNode.parentNode.removeChild(this.parentNode); //删除此div区域
var fileNodes = document.getElementsByName("fileName");
};
innerdiv.appendChild(inputNode);
innerdiv.appendChild(delNode);
var div = document.getElementById("file");
div.appendChild(innerdiv);
}
</script>
</head>
<body>
<form id="upload" action="${pageContext.request.contextPath }/fileUpload" enctype="multipart/form-data" method="post">
上传文件:<input type="button" value="添加文件" onclick="addFile(this.parentNode)"/> <br/>
<div id="file"></div>
<input type="submit" value="上传"/>
</form>
</body>
</html>
后台代码
@MultipartConfig//标识Servlet支持文件上传
//使用@WebServlet配置UploadServlet的访问路径
@WebServlet(urlPatterns = "/fileUpload")
public class FileUploadServlet extends HttpServlet {
@Override
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
//存储路径
String savePath = request.getServletContext().getRealPath("/uploadFile");
File path = new File(savePath);
if(!path.exists()) {
path.mkdirs();
}
//获取上传的文件集合
Collection<Part> parts = request.getParts();
if (parts.size() == 1) {//一次上传单个文件
Part part = request.getPart("fileName");//通过表单file控件(<input type="file" name="file">)的名字直接获取Part对象
String header = part.getHeader("content-disposition"); //获取请求头
String fileName = getFileName(header); //获取文件名
part.write(savePath + File.separator + fileName); //把文件写到指定路径
} else { //一次性上传多个文件
for (Part part : parts) {//循环处理上传的文件
//获取请求头,请求头的格式:form-data; name="file"; filename="snmp4j--api.zip"
String header = part.getHeader("content-disposition");
//获取文件名
String fileName = getFileName(header);
//把文件写到指定路径
part.write(savePath + File.separator + fileName);
}
}
PrintWriter out = response.getWriter();
out.println("上传成功");
out.flush();
out.close();
}
/**
* 根据请求头解析出文件名
* @param header 请求头
* @return 文件名
*/
public String getFileName(String header) {
String[] temp = header.split(";")[2].split("=");
//获取文件名,兼容各种浏览器的写法
String fileName = temp[1].substring(temp[1].lastIndexOf("\\") + 1).replaceAll("\"", "");
return fileName;
}
}