上传时使用common-fileupload,如果实现了ProgressListener接口,将进度信息保存到session中,这样可以随时了解上传的进度情况。进度条使用了一现成的jquery.progressbar。
上传图片时要预览图片,考虑到浏览器不兼容问题,最好是将图片上传到服务器,获取图片的服务器路径,通过session(将上传图片路径保存到session中)或者是其它的方式。不过要记得后续的上传要删除之前已上传到服务器的图片文件。
进度监听器
上传servlet
private static final long serialVersionUID = -2720594804583840761L;
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
try{
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(factory);
//设置进度监听
upload.setProgressListener(new CustomerProgressListener(req));
List items = upload.parseRequest(req);
Iterator iter = items.iterator();
while (iter.hasNext()) {
FileItem item = (FileItem) iter.next();
if (item.isFormField()){
} else {
//String fieldName = item.getFieldName();
String fileName = item.getName();
//String contentType = item.getContentType();
System.out.println();
boolean isInMemory = item.isInMemory();
long sizeInBytes = item.getSize();
File uploadedFile = new File("H://" + System.currentTimeMillis() + fileName.substring(fileName.lastIndexOf(".")));
item.write(uploadedFile);
}
}
}catch(Exception e){
e.printStackTrace();
}
resp.getWriter().print("{msg:'上传成功!'}");
resp.getWriter().flush();
}
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
}
}
进度servlet
jsp页面
},100);
});
});
// --></mce:script>
</head>
<body>
<form method="post" enctype="multipart/form-data" action="servlet/UploadServlet" target="iframeName">
<input type="file" name="uploadFileName" id="uploadFileName"><br>
<input type="submit" value="上 传" id="submit">
<span class="progressBar" id="pb1" style="display:none" mce_style="display:none"></span>
</form>
<iframe name="iframeName" id="iframeName" frameborder="0" style="display:none;" mce_style="display:none;"></iframe>
</body>
</html>