时间：2021-07-01 10:21:17 帮助过：4人阅读
//引入Plupload hideShowContent.js后
var is_upload_video = 0;
var is_upload_img = 0;
var Qiniu = new QiniuJsSDK();
var uploader = Qiniu.uploader({
runtimes: 'html5,flash,html4', //上传模式,依次退化
browse_button: 'pickfiles', //上传选择的点选按钮，**必需**
uptoken_url: '__ROOT__/qiniu/get_up_token?key={$path}&bucket_type=video', //Ajax请求upToken的Url，**强烈建议设置**（服务端提供）
//uptoken : '', //若未指定uptoken_url,则必须指定 uptoken ,uptoken由其他程序生成
//unique_names: true, // 默认 false，key为文件名。若开启该选项，SDK为自动生成上传成功后的key（文件名）。
//save_key: true, // 默认 false。若在服务端生成uptoken的上传策略中指定了 `sava_key`，则开启，SDK会忽略对key的处理
domain: '{$video_domian}', //bucket 域名，下载资源时用到，**必需**
container: 'container',
//上传区域DOM ID，默认是browser_button的父元素，
max_file_size: '60mb', //最大文件体积限制
flash_swf_url: 'Public/js/plupload/Moxie.swf', //引入flash,相对路径
max_retries: 1, //上传失败最大重试次数
dragdrop: true, //开启可拖曳上传
drop_element: 'container',
//拖曳上传区域元素的ID，拖曳文件或文件夹后可触发上传
chunk_size: '4mb', //分块上传时，每片的体积
auto_start: true, //选择文件后自动上传，若关闭需要自己绑定事件触发上传
init: {
'FilesAdded': function(up, files) {
plupload.each(files, function(file) {
// 文件添加进队列后,处理相关的事情
upload_pics_number++;
$('font_video').show();
if (upload_pics_number = 1) {
$('#Support').hide();
}
});
},
'BeforeUpload': function(up, file) {
//设置上传文件的格式和大小；
$array = ['video/mp4','video/avi','video/mpg','image/gif'];
if(-1 == jQuery.inArray( file.type, $array )){
alert("上传文件格式不正确")
window.location.reload();
return false;
}
if (file.size > 50 * 1024 * 1024) {
alert('上传文件大小不能大于50M')
window.location.reload();
return false;
}
is_upload_video = 1;
$('#fsUploadProgressBox').show();
$('#videoBox').hide()
},
'UploadProgress': function(up, file) {
var progress = new FileProgress(file, 'fsUploadProgress');
var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
progress.setProgress(file.percent + "%", up.total.bytesPerSec, chunk_size);
},
'FileUploaded': function(up, file, info) {
$('#fsUploadProgressBox').hide();
console.log(info);
var dataObj = eval("("+info+")");
if(dataObj.success == 'true') {
$.getJSON(
"__ROOT__/qiniu/get_video_pic_url?key={$path}&bucket_type=pics",
function(json){
$('#video_thumbnail_input').val(json.key);
$('#Support').show();
$('#product_video_qn').val('{$path}');
$('font_video').hide();
$('#preview_video').attr('href', "__ROOT__/product/video_show?video_stream=__ROOT__/qiniu/get_video_url?key={$path}&is_redirect=1").show();
is_upload_video = 0;
}
);
} else {
alert("上传失败，请重新上传");
$('#Support').show();
$('font_video').show();
return false;
}
},
'Error': function(up, err, errTip) {
//上传出错时,处理相关的事情
$('font_video').show();
$('#Support').show();
alert(errTip);
},
'UploadComplete': function() {
$('#fsUploadProgressBox').hide();
//队列文件处理完毕后,处理相关的事情
$('#videoBox').html('上传完成');
chunk_index = 0;
},
'Key': function(up, file) {
// 若想在前端对每个文件的key进行个性化处理，可以配置该函数
// 该配置必须要在 unique_names: false , save_key: false 时才生效
var key = "{$path}";
// do something with key here
return key
}
}
});//引入Plupload hideShowContent.js后
var is_upload_video = 0;
var is_upload_img = 0;
var Qiniu = new QiniuJsSDK();
var uploader = Qiniu.uploader({
runtimes: 'html5,flash,html4', //上传模式,依次退化
browse_button: 'pickfiles', //上传选择的点选按钮，**必需**
uptoken_url: '__ROOT__/qiniu/get_up_token?key={$path}&bucket_type=video', //Ajax请求upToken的Url，**强烈建议设置**（服务端提供）
//uptoken : '', //若未指定uptoken_url,则必须指定 uptoken ,uptoken由其他程序生成
//unique_names: true, // 默认 false，key为文件名。若开启该选项，SDK为自动生成上传成功后的key（文件名）。
//save_key: true, // 默认 false。若在服务端生成uptoken的上传策略中指定了 `sava_key`，则开启，SDK会忽略对key的处理
domain: '{$video_domian}', //bucket 域名，下载资源时用到，**必需**
container: 'container',
//上传区域DOM ID，默认是browser_button的父元素，
max_file_size: '60mb', //最大文件体积限制
flash_swf_url: 'Public/js/plupload/Moxie.swf', //引入flash,相对路径
max_retries: 1, //上传失败最大重试次数
dragdrop: true, //开启可拖曳上传
drop_element: 'container',
//拖曳上传区域元素的ID，拖曳文件或文件夹后可触发上传
chunk_size: '4mb', //分块上传时，每片的体积
auto_start: true, //选择文件后自动上传，若关闭需要自己绑定事件触发上传
init: {
'FilesAdded': function(up, files) {
plupload.each(files, function(file) {
// 文件添加进队列后,处理相关的事情
upload_pics_number++;
$('font_video').show();
if (upload_pics_number = 1) {
$('#Support').hide();
}
});
},
'BeforeUpload': function(up, file) {
//设置上传文件的格式和大小；
$array = ['video/mp4','video/avi','video/mpg','image/gif'];
if(-1 == jQuery.inArray( file.type, $array )){
alert("上传文件格式不正确")
window.location.reload();
return false;
}
if (file.size > 50 * 1024 * 1024) {
alert('上传文件大小不能大于50M')
window.location.reload();
return false;
}
is_upload_video = 1;
$('#fsUploadProgressBox').show();
$('#videoBox').hide()
},
'UploadProgress': function(up, file) {
var progress = new FileProgress(file, 'fsUploadProgress');
var chunk_size = plupload.parseSize(this.getOption('chunk_size'));
progress.setProgress(file.percent + "%", up.total.bytesPerSec, chunk_size);
},
'FileUploaded': function(up, file, info) {
$('#fsUploadProgressBox').hide();
console.log(info);
var dataObj = eval("("+info+")");
if(dataObj.success == 'true') {
$.getJSON(
"__ROOT__/qiniu/get_video_pic_url?key={$path}&bucket_type=pics",
function(json){
$('#video_thumbnail_input').val(json.key);
$('#Support').show();
$('#product_video_qn').val('{$path}');
$('font_video').hide();
$('#preview_video').attr('href', "__ROOT__/product/video_show?video_stream=__ROOT__/qiniu/get_video_url?key={$path}&is_redirect=1").show();
is_upload_video = 0;
}
);
} else {
alert("上传失败，请重新上传");
$('#Support').show();
$('font_video').show();
return false;
}
},
'Error': function(up, err, errTip) {
//上传出错时,处理相关的事情
$('font_video').show();
$('#Support').show();
alert(errTip);
},
'UploadComplete': function() {
$('#fsUploadProgressBox').hide();
//队列文件处理完毕后,处理相关的事情
$('#videoBox').html('上传完成');
chunk_index = 0;
},
'Key': function(up, file) {
// 若想在前端对每个文件的key进行个性化处理，可以配置该函数
// 该配置必须要在 unique_names: false , save_key: false 时才生效
var key = "{$path}";
// do something with key here
return key
}
}
});
关于视频截图的接口你可以参考：
http://developer.qiniu.com/docs/v6/api/reference/fop/av/vframe.html
vframe 是同步的fop。
比如对于视频：http://rwxf.qiniudn.com/1.mp4
第五秒的截图外链是：http://rwxf.qiniudn.com/1.mp4?vframe/png/offset/5