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
原创粉丝点击