1:创建video获取视频(上传或者网络视频)
var video = document.createElement("VIDEO");
2:指定video截取当前帧数
video.currentTime = 5; //必须设置视频当前时长,要不然会黑屏
3:创建canvas画布
var canvas = document.createElement('canvas');
4:视频加载完毕,截取视频帧数,绘画视频封面
// 图片绘制
video.onloadeddata = (() => {
// 设置画布的宽高
canvas.width = video.clientWidth;
canvas.height = video.clientHeight;
canvas.getContext('2d').drawImage(video, 0, 0, canvas.width,canvas.height);
var dataURL = canvas.toDataURL('image/jpeg'); //base64 格式
// console.log(dataURL,"-----")
})
完整的uniapp h5选择视频
//选择视频
chooseVideo: function() {
let that = this;
uni.chooseVideo({
count: 1,
sourceType: ['album'],
success: function(res) {
let videoss = document.createElement('video');
var canvas = document.createElement('canvas');
videoss.currentTime = 5;
videoss.onloadeddata = function(v) {
var ctx = canvas.getContext('2d');
ctx.drawImage(videoss, 0, 0, res.width, res.height, 0, 0, 290, 150);
var dataURL = canvas.toDataURL('image/jpeg'); //base64 格式
console.log(dataURL,"-----")
}
}
})
},