图片上传功能
上一篇中,我们了解了图片上传过程中的预览功能,本篇我们着重实现图片功能,以上传图片为例,同样适用于上传文件等。
- jsp页面的编写:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>上传图片</title>
<script type="text/javascript" src="js/upload.js"></script>
</head>
<body>
<h1>上传图片完整例子</h1>
<form action="../UploadServlet" method="post" enctype="multipart/form-data">
名称:<input type="text" name="name"><br>
图片:<input type="file" name="image" onchange="previewImage(this,'imgPreviewId')"><br>
<img alt="" src="" name="srcImage" id="imgPreviewId" width="120px;" height="120px;">
<input type="submit" value="提交">
</form>
</body>
</html>
同样引入upload.js实现图片上传的预览功能
2.. 页面运行效果如下:
3.编写uploadservlet
package cn.com.mp.servlet;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.MultipartConfig;
import javax.servlet.annotation.WebInitParam;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import cn.com.mp.utils.HttpUtil;
@MultipartConfig
@WebServlet(urlPatterns = "/UploadServlet", initParams = {
@WebInitParam(name = "path", value = "D:/apache-tomcat-8.0.24/webapps/UploadDemo/page/image") })
public class UploadServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
public UploadServlet() {
super();
}
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
String name = request.getParameter("name");
// 上传图片
String fileName = "";
String path = this.getInitParameter("path");
fileName = HttpUtil.upload(request, "image", path);
System.out.println(name + "==" + fileName);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}
注意:与普通servlet的不同点,上传图片的servlet需要使用
@WebServlet(urlPatterns = “/UploadServlet”, initParams = {
@WebInitParam(name = “path”, value = “D:/apache-tomcat-8.0.24/webapps/UploadDemo/page/image”) })
使用urlPatterns 指明:servlet的访问路径
使用@WebInitParam指明上传图片的保存路径,其中包括name ,value
同时需要使用@MultipartConfig支持使用servlet3.0 part新特性
4.编写上传图片的工具类
package cn.com.mp.utils;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.Part;
public class HttpUtil {
public static String upload(HttpServletRequest request, String name, String upload_path)
throws IOException, ServletException {
// 获得文件路径和文件名
String fileName = "";
Part part = request.getPart(name);
if (part != null) {
String realName = part.getSubmittedFileName();
System.out.println(realName+"====realName");
fileName = FileHelper.generateFileName(realName);
// 执行文件上传
if (!realName.equals("")) {
File file = new File(upload_path, fileName);
if (!file.exists()) {
file.createNewFile();
}
InputStream in = part.getInputStream();
FileOutputStream out = new FileOutputStream(file);
byte[] cache = new byte[256];
int length = 0;
while ((length = in.read(cache)) != -1) {
out.write(cache, 0, length);
}
out.flush();
if (out != null) {
out.close();
}
if (in != null) {
in.close();
}
}
}
return fileName;
}
}
- 编写fileName文件生成名的产生工具类(后期保存数据库时,需要保存此值)
package cn.com.mp.utils;
import java.text.DateFormat;
import java.text.DecimalFormat;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.Random;
public final class FileHelper {
public static String getRealFileName(String fileName){
int start = fileName.lastIndexOf("\\");
String value ="";
if(start>0){
value = fileName.substring(start+1);
}else{
value = fileName;
}
return value;
}
public static String generateFileName(String fileName) {
DateFormat format = new SimpleDateFormat("yyyyMMddHHmmss");
String formatDate = format.format(new Date());
int random = new Random().nextInt(10000);
int position = fileName.lastIndexOf(".");
String extension = fileName.substring(position);
return formatDate + random + extension;
}
public static String FormetFileSize(long fileS) {
DecimalFormat df = new DecimalFormat("#.00");
String fileSizeString = "";
if (fileS < 1024) {
fileSizeString = df.format((double) fileS) + "B";
} else if (fileS < 1048576) {
fileSizeString = df.format((double) fileS / 1024) + "KB";
} else if (fileS < 1073741824) {
fileSizeString = df.format((double) fileS / 1048576) + "MB";
} else {
fileSizeString = df.format((double) fileS / 1073741824) + "GB";
}
return fileSizeString;
}
}
6.运行效果:
提交上传控制台结果如下:
7.结果:
在servlet自定义图片的保存目录下寻找201704291440543396.jpg图片
确实是存在这样的一张照片,至此说明图片上传的功能我们已经完成。
8.总结:
本片中我们使用了servlet3.0的新特性Part支持编写了图片上传功能,关于Part的更多信息请参考一下地址:
servlet3.0 part
完整例子下载:UploadDemo
欢迎大家评论指教!