js代码
/**
* Created by 西瓜哥 on 2017/8/18.
* 分片,急速秒传和断点续传
*/
$(function () {
var obj = $('#uploader-video');
var attr = utils.toJson(obj.attr('data-options'));
var $list = $("#videoList");
var video_container = $(".video-container");
var GUID = WebUploader.Base.guid();
var chunkSize = 10 * 1024 * 1024;
//注册功能一定要写在前头,否则不会生效
WebUploader.Uploader.register({
'before-send-file': 'beforeSendFile'
, "before-send": "beforeSend"
, "after-send-file": "afterSendFile"
}, {
beforeSendFile: function (file) {
var owner = this.owner,
server = this.options.server,
deferred = WebUploader.Deferred(),
obj = $list.find(' #' + file.id);
owner.md5File(file.source).fail(function () {
deferred.reject();
}).progress(function (percentage) {
obj.find('.note').text('读取文件进度' + parseInt(percentage * 100) + "%");
}).then(function (md5Value) {
obj.find('.note').text('文件验证完毕...');
file.wholeMd5 = md5Value;
$.ajax(server, {
dataType: 'json',
type: 'post',
data: {
status: "md5Check",
unique: md5Value
},
cache: false,
timeout: 1000
}).then(function (response, textStatus, jqXHR) {
if (response.exist) {
deferred.reject();
owner.skipFile(file);
obj.find('.note').remove();
obj.find('p.state').attr('title', '正在上传').html('100%');
UploadComlate(file, response);
file.uniqueFileName = md5Value;
} else {
deferred.resolve();
file.uniqueFileName = md5Value;
}
}, function (jqXHR, textStatus, errorThrown) {
deferred.resolve();
});
});
return deferred.promise();
}, beforeSend: function (block) {
//分片验证是否已传过,用于断点续传
var deferred = WebUploader.Deferred();
var server = this.options.server;
$.ajax({
type: "POST"
, url: server
, data: {
status: "chunkCheck"
, name: block.file.uniqueFileName
, chunkIndex: block.chunk
, ext: block.file.ext
, size: block.end - block.start
}
, cache: false
, timeout: 1000
, dataType: "json"
}).then(function (response, textStatus, jqXHR) {
if (response.exist) {
deferred.reject();
} else {
deferred.resolve();
}
}, function (jqXHR, textStatus, errorThrown) { //任何形式的验证失败,都触发重新上传
deferred.resolve();
});
return deferred.promise();
}, afterSendFile: function (file) {
//合并文件
var chunksTotal = 0;
if ((chunksTotal = Math.ceil(file.size / chunkSize)) >= 1) {
//合并请求
var deferred = WebUploader.Deferred();
var server = this.options.server;
$.ajax({
type: "POST"
, url: server
, data: {
status: "chunksMerge"
, name: file.uniqueFileName
, chunks: chunksTotal
, original_name: file.source.name
, ext: file.ext
, md5: file.md5value
}
, cache: false
, dataType: "json"
}).then(function (response, textStatus, jqXHR) {
deferred.resolve();
UploadComlate(file, response);
}, function (jqXHR, textStatus, errorThrown) {
deferred.reject();
});
return deferred.promise();
} else {
UploadComlate(file);
}
}
});
var uploader = WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '/static/js/plugins/webuploader/Uploader.swf',
runtimeOrder: 'html5,flash',
// 文件接收服务端。
server: attr.url,
// 选择文件的按钮。可选。
// 内部根据当前运行是创建,可能是input元素,也可能是flash.
pick: {
id: '#videoPicker',
multiple: false,
},
threads: 1,
resize: false,
compress: false,
duplicate: true,
chunked: true,
chunkSize: chunkSize,
formData: {guid: GUID},
fileNumLimit: 10,
// fileSingleSizeLimit:2*1024*1024*1024,
accept: {
title: 'Videos',
extensions: 'mp4,mkv,flv,avi,vob,mov,mpg',
mimeTypes: 'video/*'
}
});
uploader.on('fileQueued', function (file) {
video_container.hide();
var $li = $(
'
'
'