html5 图片上传范例详解

html5 最新的拖拽上传 网上的例子也不少，但是本人没看到什么特别全面的，所以特地在这里把前台和后台代码全部贴上，望还没实现的人今早实现。
代码如下：

前台的jsp如下：

<%@ page language="java" pageEncoding="UTF-8"%>
<%@ page isELIgnored="false"%>
<%@ taglib uri="" prefix="c"%>
<%@ taglib uri="" prefix="fn"%>
<%@ taglib prefix="fmt" uri="" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()+ path + "/";
%>








       




 

           

把你的图片拖到下面的容器内：

     
           

                 
           

           

               

已经拖进过来的文件：

               

           

               
       

     





   后台的java代码如下：
        /**
*
* @author 程欣伟
* 图片上传
* @param request
*/
@RequestMapping("upload.html")
public void upload(HttpServletRequest  request) {
try {
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;

//获取文件map信息
Map fileMap = multipartRequest.getFileMap();

//迭代map
Iterator> iterator = fileMap.entrySet().iterator();
while(iterator.hasNext()){
Map.Entry entry =  iterator.next();
//获取文件信息
MultipartFile value   = entry.getValue();
//获取文件大小
Long size = value.getSize();
//获取文件名字
String fileName = value.getOriginalFilename();
//获取后缀名
String houzhuiName = fileName.substring(fileName.lastIndexOf('.')+1,fileName.length());
BufferedOutputStream out = null;
BufferedInputStream in = null;
//获取文件字节数组
byte[] b = value.getBytes();
try {
String filename = UUID.randomUUID().toString(); // 重命名文件
String dir = "d:/image/";
File file = new File(dir);
if(!file.exists()){
file.mkdir();
}
String filepathString = dir+filename+"."+houzhuiName;
//吧字节数组 写入
out = new BufferedOutputStream(new FileOutputStream(filepathString, true));
out.write(b, 0, b.length);

} catch (Exception ex) {
// TODO: handle exception
} finally {
if (out != null) {
out.close();
}
if (in != null) {
in.close();
}
}
}
} catch (Exception ex) {
ex.printStackTrace();
}
}