Java的新项目学成在线笔记-day13（十一）

6.3.3.1 钩子方法 
在webuploader中提供很多钩子方法，下边列出一些重要的：
 
本项目使用如下钩子方法：
1）before-send-file
在开始对文件分块儿之前调用，可以做一些上传文件前的准备工作，比如检查文件目录是否创建完成等。

2）before-send
在上传文件分块之前调用此方法，可以请求服务端检查分块是否存在，如果已存在则此分块儿不再上传。
3）after-send-file
在所有分块上传完成后触发，可以请求服务端合并分块文件。
注册钩子方法源代码：
 

[AppleScript] 纯文本查看 复制代码

?

WebUploader.Uploader.register({
 "before‐send‐file":"beforeSendFile",
   "before‐send":"beforeSend",
   "after‐send‐file":"afterSendFile"
 }

6.3.3.2 构建WebUploader 
使用webUploader前需要创建webUploader对象。 指定上传分块的地址：/api/media/upload/uploadchunk
 

[AppleScript] 纯文本查看 复制代码

?

// 创建uploader对象，配置参数 this.uploader = WebUploader.create(   {
  swf:"/static/plugins/webuploader/dist/Uploader.swf",//上传文件的flash文件，浏览器不支持h5时启动 flash
   server:"/api/media/upload/uploadchunk",//上传分块的服务端地址，注意跨域问题
  fileVal:"file",//文件上传域的name     pick:"#picker",//指定选择文件的按钮容器
   auto:false,//手动触发上传
  disableGlobalDnd:true,//禁掉整个页面的拖拽功能
   chunked:true,// 是否分块上传
   chunkSize:1*1024*1024, // 分块大小（默认5M）
    threads:3, // 开启多个线程（默认3个）
     prepareNextFile:true// 允许在文件传输时提前把下一个文件准备好   } )

6.3.3.3 before-send-file 
文件开始上传前前端请求服务端准备上传工作。
参考源代码如下：
 

[AppleScript] 纯文本查看 复制代码

?

type:"POST", url:"/api/media/upload/register", data:{
  // 文件唯一表示
  fileMd5:this.fileMd5,
 fileName: file.name,
  fileSize:file.size,
  mimetype:file.type,
fileExt:file.ext }

6.3.3.4 before-send 
上传分块前前端请求服务端校验分块是否存在。
参考源代码如下：

[AppleScript] 纯文本查看 复制代码

?

[mw_shl_code=applescript,true]type:"POST", url:"/api/media/upload/checkchunk", data:{
// 文件唯一表示
  fileMd5:this.fileMd5,
// 当前分块下标
chunk:block.chunk,
  // 当前分块大小
  chunkSize:block.end‐block.start

}[/mw_shl_code]