炫酷的文件上传效果分析.docx

1、文件上传基础? ? 1）浏览器页面：????form action=${pageContext.request.contextPath }/UploadServlet method=POST enctype=multipart/form-data选择文件：input type=file name=name/br/文件信息：input type=text name=info/input type=submit value=提交//form? ? 2）服务器Servlet端：? ??? ??? ? 使用Apache提供的和文件上传有关的两个jar包：common-fileupload-1.3.1.jar和common-io-2.2.jar。注意后面那个包的版本一定要=2。? ??? ? 代码：publicclassUploadServletextendsHttpServlet{?privateString serverPath =e:/uploader/;publicvoid doGet(HttpServletRequest request,HttpServletResponse response)throwsServletException,IOException{request.setCharacterEncoding(utf-8);response.setContentType(text/html;charset=utf-8);//[1]创建一个DiskFileItemFactory对象,配置缓存信息DiskFileItemFactory factory =newDiskFileItemFactory();//[2]创建ServletFIleUpload对象ServletFileUpload sfu =newServletFileUpload(factory);//[3]设置文件名称的编码sfu.setHeaderEncoding(utf-8);sfu.setFileSizeMax(1024);//设置单个文件的最大字节数:1Msfu.setSizeMax(10*1024);//设置整个表单的最大字节数：10M//[4]开始解析文件try{//一个文件/普通数据就封装在一个FileItem中ListFileItem items = sfu.parseRequest(request);?//[5]获取文件信息for(FileItem item:items){//[6]判断是文件还是普通数据if(item.isFormField()){//普通数据String fileName = item.getFieldName();if(fileName.equals(info)){//获取数据String value = item.getString();System.out.println(info:+value);}}else{//文件//获取文件名称String name = item.getName();//获取文件实际内容InputStream is = item.getInputStream();//保存文件，使用common-io.jar包中的工具类，将输入流保存至文件中FileUtils.copyInputStreamToFile(is,newFile(serverPath+/+name));System.out.println(文件：+name+保存成功);}}}catch(FileUploadException e){// TODO Auto-generated catch blocke.printStackTrace();}}?publicvoid doPost(HttpServletRequest request,HttpServletResponse response)throwsServletException,IOException{?doGet(request,response);}?}2、使用WebUploader上传组件? ? baidu开发的开源组件WebUploader，可以实现异步上传文件、拖拽式上传、黏贴上传、上传进度监控、文件缩略图、大文件的断点续传、大文件秒传、? ? 2.1 下载WebUpload组件? ??? ? 到WebUploader官网下载，? ??? ? 2.2基本文件上传Demo（包含上传进度）? ??? ? 前端：? ??? ??? ??? ? 1）在页面导入所需css、js!--1.准备好webuploader的资源--link rel=stylesheet type=text/css href=${pageContext.request.contextPath }/