我们先编写页面并导入jquery的包
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-1.8.3.min.js"></script>
</head>
<body>
<input type="file" name="file"><br>
<input type="button" value="上传"><br>
</body>
</html>然后为它添加相应的ajax代码，对于jquery如何使用我就不再讲解，大家可以去以下网址进行学习：jQuery 教程 | 菜鸟教程 (runoob.com)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-1.8.3.min.js"></script>
</head>
<body>
<input type="file" name="file"><br>
<input type="button" value="上传"><br>
</body>
</html>
<script>
$(":button").click(function () {
var datas = new FormData();
datas.append("file",$(":file").get(0).files[0]);
$.ajax({
url:"ser01",
type:"post",
dataType:"json",
processData: false,
contentType:false,
data:datas,
success:function (data) {
console.log(data)
}
})
})
</script>接下我们编写后端代码：
protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
DiskFileItemFactory diskFileItemFactory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(diskFileItemFactory);
try {
List<FileItem> fileItems = upload.parseRequest(req);
for (FileItem fileItem : fileItems) {
if (fileItem.isFormField())
{
// 是普通表单元素
System.out.println("普通表单元素"+fileItem.getName()+"="+fileItem.getString());
}
else
{
// 是文件
System.out.println("文件："+fileItem.getName()+" 文件流inputStream："+fileItem.getInputStream());
int len;
byte buffer[] = new byte[1024*10];
BufferedInputStream bis = new BufferedInputStream(fileItem.getInputStream());
BufferedOutputStream bos = new BufferedOutputStream(new FileOutputStream("E:/"+fileItem.getName()));
while ((len=bis.read(buffer))!=-1)
{
bos.write(buffer,0,len);
}
bos.flush();
bis.close();
bos.flush();
}
}
Map<String,Object> result = new LinkedHashMap<>();
result.put("code","200");
result.put("msg","上传成功");
result.put("data","");
resp.setContentType("text/html;charset=utf-8");
resp.getWriter().write(JSONObject.toJSONString(result));
} catch (FileUploadException e) {
e.printStackTrace();
}
}在我们进行调用后，上传的文件确实在后台服务器中被接收到了，而且也成功的被写入到了E盘中
