webuploader文件分片上传与springmvc后台合并
来源:互联网 发布:奶茶店市场调查数据 编辑:程序博客网 时间:2024/06/05 08:04
废话不多说,直接给出webuploader的配置。其实配置很简单,在官网上看看文档就行了。
var uploader = WebUploader.create({auto: true,swf: '${path }/admin/lib/webuploader/0.1.5/Uploader.swf',// 文件接收服务端。server: '${path}/edu/videoUpload',pick: '#picker',/*accept:{ title: 'Videos', extensions: 'mp4,flv,avi', mimeTypes: 'video/*'},*/ chunked: true, //分片处理 chunkSize: 5 * 1024 * 1024, //每片5M threads:1,//上传并发数。允许同时最大上传进程数。 disableGlobalDnd: true, formData: {guid:"<%=UUID.randomUUID().toString()%>"}}); uploader.on("fileQueued", function(file) { /* var fileName=file.name; var videoTypes="mp4"; if(fileName.indexOf(videoTypes)<=0){ layer.msg("请上传MP4格式的视频..."); uploader.removeFile( file ); }else{ $("#fileList").append("<div id='" + file.id + "'><span>" + file.name + "</span><span style='margin-left:20px;' class='state'>上传中...</span><div><span class='percentage'><span></div></div>"); }*/ $("#fileList").append("<div id='" + file.id + "'><span>" + file.name + "</span><span style='margin-left:20px;' class='state'>上传中...</span><div><span class='percentage'><span></div></div>"); });// 监控上传进度// percentage:代表上传文件的百分比uploader.on("uploadProgress", function(file, percentage) { $("#" + file.id).find("span.percentage").text(Math.round(percentage * 100) + "%"); var $li = $( '#'+file.id ), $percent = $li.find('.progress .progress-bar'); // 避免重复创建 if ( !$percent.length ) { $percent = $('<div class="progress progress-striped active">' + '<div class="progress-bar" role="progressbar" style="width: 0%">' + '</div>' + '</div>').appendTo( $li ).find('.progress-bar'); } //$li.find('p.state').text('上传中'); $percent.css( 'width', percentage * 100 + '%' );}); uploader.on('uploadSuccess', function( file,response ) {//alert("文件上传成功!");//$("#videoAddress").val(response.extend.videoAddress);$("#videoOriginalname").val(response.extend.videoOriginalname);$(".state").text("上传成功!");//将提交按钮置为可用$("#saveBtn").removeAttr("disabled");//隐藏上传视频按钮$("#picker").hide();});uploader.on( 'uploadError', function( file ) {$(".state").text("上传失败");});uploader.on("error",function (type){/* if (type=="Q_TYPE_DENIED"){ layer.msg("请上传mp4格式文件"); }*/ });
后台是ssm框架,controller是这样的:
@ResponseBody@RequestMapping("/videoUpload")public Msg videoUpload(MultipartFile file,String guid,Integer chunk,Integer chunks,HttpServletRequest request){if(chunk==null&&chunks==null){//没有分片 直接保存 String filePath=FileUtils.fileUpload(file, request, Video_Path); return Msg.success().add("videoAddress", filePath).add("videoOriginalname", file.getOriginalFilename());}//获取项目的根路径String realpath=request.getSession().getServletContext().getRealPath("/");//截取上传文件的类型String fileType=FileUtils.getFileType(file.getOriginalFilename()); /* 下面用的两个静态变量 private static final String Temp_Video_Path="video/temp"; private static final String Video_Path="video"; */ //根据guid 创建一个临时的文件夹File file2=new File(realpath+Temp_Video_Path+"/"+guid+"/"+chunk+fileType);if(!file2.exists()){file2.mkdirs();}try {//保存每一个分片file.transferTo(file2);} catch (Exception e) {e.printStackTrace();}//如果当前是最后一个分片,则合并所有文件if(chunk==(chunks-1)){FileOutputStream fileOutputStream=null;BufferedOutputStream bufferedOutputStream=null;BufferedInputStream inputStream=null;try {Calendar now=Calendar.getInstance();String videoAddress=Video_Path+"/"+now.get(Calendar.YEAR)+"/"+(now.get(Calendar.MONTH)+1)+"/"+now.get(Calendar.DAY_OF_MONTH)+"/"+FileUtils.getUUID()+fileType;File video=new File(realpath+videoAddress);//先判断文件的父目录是否存在,不存在需要创建;否则报错if(!video.getParentFile().exists()){video.getParentFile().mkdirs();video.createNewFile();//创建文件}//创建流 fileOutputStream=new FileOutputStream(video, true);//创建文件输入缓冲流bufferedOutputStream=new BufferedOutputStream(fileOutputStream);byte[] buffer = new byte[1024];//一次读取1024个字节File tempFiles=new File(realpath+Temp_Video_Path+"/"+guid);File [] files=tempFiles.listFiles();//对这个文件数组进行排序Arrays.sort(files, new Comparator() {@Overridepublic int compare(File o1, File o2) {int o1Index = Integer.parseInt(o1.getName().split("\\.")[0]);int o2Index = Integer.parseInt(o2.getName().split("\\.")[0]);if (o1Index > o2Index) {return 1;} else if (o1Index == o2Index){return 0;} else {return -1;}}}); for (int i = 0; i < files.length; i ++) { File fileTemp=files[i]; inputStream = new BufferedInputStream(new FileInputStream(fileTemp)); int readcount; while ((readcount = inputStream.read(buffer)) > 0) { bufferedOutputStream.write(buffer, 0, readcount); bufferedOutputStream.flush(); } inputStream.close();}bufferedOutputStream.close();//删除分块文件//一个文件夹一起删了for (int i = 0; i < files.length; i ++) {files[i].delete();}tempFiles.delete();/* */ return Msg.success().add("videoAddress", videoAddress).add("videoOriginalname", file.getOriginalFilename()); } catch (IOException e) {e.printStackTrace();}finally{if(inputStream!=null){try {inputStream.close();} catch (IOException e) {e.printStackTrace();}}if(fileOutputStream!=null){try {fileOutputStream.close();} catch (IOException e) {e.printStackTrace();}}if(bufferedOutputStream!=null){try {bufferedOutputStream.close();} catch (IOException e) {e.printStackTrace();}}}}return Msg.success("文件上传完但未合并!");}
文件上传效果图是这样的
阅读全文
1 0
- webuploader文件分片上传与springmvc后台合并
- (三)springMVC WebUploader分片上传
- 基于NodeJs的Express及Webuploader实现大文件分片上传与合并(一)
- webuploader分片上传大文件
- 基于NodeJs的Express及Webuploader实现大文件分片上传与合并(二)——组件化实现
- webuploader 实现大文件 分片上传
- webuploader在springMVC+jquery+Java开发环境下的大文件分片上传
- webuploader java分片上传
- webuploader java上传文件后台源码 mpush
- webuploader+springmvc实现多文件上传(html+js+css原创,后台代码借鉴)
- webuploader+springmvc实现多文件上传(html+js+css原创,后台代码借鉴)
- WebUploader+SpringMVC实现文件上传功能
- WebUploader+SpringMVC实现文件上传功能
- 前段WebUploader;JavaEE大文件分片上传接收
- 百度Webuploader 大文件分片上传(.net接收)
- webuploader大文件 分片 断点续传
- (二)asp.net WebUploader 分片上传
- webuploader分片上传(前后端分离)
- 广度优先搜索
- java报错:java.lang.Integer cannot be cast to java.lang.Long
- 微信小程序中template模板使用
- 行程码压缩算法
- Spring IoC的好处
- webuploader文件分片上传与springmvc后台合并
- android消息机制2-剖析核心类ActivityThread
- 输入两个整数a和b,及另一正整数c,计算a/b,结果精确到小数点后c位
- 最大连续子序列
- Mina Socket会话配置
- C语言和内存初步框架了解
- 初始博客
- nginx禁止恶意压力测试
- Java基础你要知道的事情------抽象与接口