ajax异步上传文件(无需表单)

       今天给大家带来的是ajax上传文件，不需要表单，不需要把表单设置二级制数据传输格式，简单粗暴，看了之后的都会了。废话不多说，下面看代码把，最下面给大家哦提供一个示列下载。我这里使用的是jsp+servlet实现的，你们需要融合到别的框架改下代码就行。

第一个是后台的代码:

package control;import java.io.File;import java.io.IOException;import java.io.PrintWriter;import java.util.Date;import java.util.List;import javax.servlet.ServletConfig;import javax.servlet.ServletContext;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.apache.commons.fileupload.FileItem;import org.apache.commons.fileupload.FileUploadException;import org.apache.commons.fileupload.disk.DiskFileItemFactory;import org.apache.commons.fileupload.servlet.ServletFileUpload;import entity.MyFileInfo;/** *  * 文件上传 具体步骤：  * 1）获得磁盘文件条目工厂 DiskFileItemFactory 要导包  * 2） 利用 request 获取真实路径，供临时文件存储，和 最终文件存储 ，这两个存储位置可不同，也可相同 * 3）对 DiskFileItemFactory 对象设置一些 属性 * 4）高水平的API文件上传处理 ServletFileUpload upload = newServletFileUpload(factory);目的是调用 parseRequest（request）方法 获得 FileItem 集合list ， * 5）在 FileItem 对象中 获取信息， 遍历， 判断 表单提交过来的信息 是否是 普通文本信息 另做处理  * 6） 第一种. 用第三方提供的item.write( new File(path,filename) ); 直接写到磁盘上 第二种. 手动处理 *  */public class UploadFileServlet extends HttpServlet {// 文件信息private static MyFileInfo myFileInfo = null;private static final long serialVersionUID = 1L;// 保存文件的目录private static String PATH_FOLDER = "/";// 存放临时文件的目录private static String TEMP_FOLDER = "/";@Overridepublic void init(ServletConfig config) throws ServletException {ServletContext servletCtx = config.getServletContext();// 初始化路径// 保存文件的目录PATH_FOLDER = servletCtx.getRealPath("/upload");// 存放临时文件的目录,存放xxx.tmp文件的目录TEMP_FOLDER = servletCtx.getRealPath("/uploadTemp");}protected void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {request.setCharacterEncoding("GBK"); // 设置编码response.setCharacterEncoding("GBK");response.setContentType("text/html;charset=GBK");// 获得磁盘文件条目工厂DiskFileItemFactory factory = new DiskFileItemFactory();// 如果没以下两行设置的话，上传大的 文件 会占用 很多内存，// 设置暂时存放的 存储室 , 这个存储室，可以和 最终存储文件 的目录不同/** * 原理 它是先存到 暂时存储室，然后在真正写到 对应目录的硬盘上， 按理来说 当上传一个文件时，其实是上传了两份，第一个是以 .tem * 格式的 然后再将其真正写到 对应目录的硬盘上 */factory.setRepository(new File(TEMP_FOLDER));// 设置 缓存的大小，当上传文件的容量超过该缓存时，直接放到 暂时存储室factory.setSizeThreshold(1024 * 1024);// 高水平的API文件上传处理ServletFileUpload upload = new ServletFileUpload(factory);try {// 提交上来的信息都在这个list里面// 这意味着可以上传多个文件// 请自行组织代码List list = upload.parseRequest(request);// 获取上传的文件FileItem item = getUploadFileItem(list);// 获取文件名String filename = getUploadFileName(item);// 保存后的文件名String saveName = new Date().getTime() + filename.substring(filename.lastIndexOf("."));// 保存后图片的浏览器访问路径String fileUrl = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()+ request.getContextPath() + "/upload/" + saveName;System.out.println("存放目录:" + PATH_FOLDER);System.out.println("文件名:" + filename);System.out.println("浏览器访问路径:" + fileUrl);// 真正写到磁盘上item.write(new File(PATH_FOLDER, saveName)); // 第三方提供的String fileType = filename.substring(filename.lastIndexOf(".") + 1);PrintWriter writer = response.getWriter();// 把文件响应给前台显示writer.print("{");writer.print("fileUrl:\"" + fileUrl + "\"");writer.print("}");writer.close();myFileInfo = new MyFileInfo();myFileInfo.setCreateName("小刘");myFileInfo.setCreateDate(new Date());myFileInfo.setFileName(filename);myFileInfo.setFilePath(PATH_FOLDER + "/" + filename);myFileInfo.setFileSize(item.getSize());myFileInfo.setFileType(fileType);myFileInfo.setFileUrl(fileUrl);} catch (FileUploadException e) {e.printStackTrace();} catch (Exception e) {e.printStackTrace();}}private FileItem getUploadFileItem(List list) {for (FileItem fileItem : list) {if (!fileItem.isFormField()) {return fileItem;}}return null;}private String getUploadFileName(FileItem item) {// 获取路径名String value = item.getName();// 索引到最后一个反斜杠int start = value.lastIndexOf("/");// 截取 上传文件的 字符串名字，加1是 去掉反斜杠，String filename = value.substring(start + 1);return filename;}protected void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {this.doGet(request, response);}public static MyFileInfo getMyFileInfo() {return myFileInfo;}}

第二个是文件实体类代码:

package entity;import java.util.Date;public class MyFileInfo {// 文件路径private String filePath;// 文件名称private String fileName;// 文件大小private Long fileSize;// 文件类型private String fileType;// 创建时间private Date createDate;// 创建人private String createName;// 图片访问路径private String fileUrl;public String getFileUrl() {return fileUrl;}public void setFileUrl(String fileUrl) {this.fileUrl = fileUrl;}public String getFilePath() {return filePath;}public void setFilePath(String filePath) {this.filePath = filePath;}public String getFileName() {return fileName;}public void setFileName(String fileName) {this.fileName = fileName;}public Long getFileSize() {return fileSize;}public void setFileSize(Long fileSize) {this.fileSize = fileSize;}public String getFileType() {return fileType;}public void setFileType(String fileType) {this.fileType = fileType;}public Date getCreateDate() {return createDate;}public void setCreateDate(Date createDate) {this.createDate = createDate;}public String getCreateName() {return createName;}public void setCreateName(String createName) {this.createName = createName;}}

第三个是jsp界面：

<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8" import="entity.MyFileInfo"%>        

第四个是web.xml的配置：

uploadFileServletcontrol.UploadFileServletuploadFileServlet/uploadFileuploadFile.jsp

第五个是js：

第六个是jar包：

演示的效果:

好了，整个项目基本需要的内容都在这，清楚明了，详细。后期需要附加到自己项目都是可以的。

最后：没有整合成功的，我提供了下载地址，可以去这里下载：http://download.csdn.net/download/qq_27026603/9941363