2、将获取的视频最后一桢图片替换为video的背景图片
视频截取图片
function video2Base64 (video: HTMLVideoElement) { let dataURL = '', canvas = document.createElement("canvas"); if (video.videoWidth !== 0) { canvas.width = video.videoWidth; canvas.height = video.videoHeight; (canvas.getContext("2d") as CanvasDrawImage).drawImage(video, 0, 0, canvas.width, canvas.height); //绘制canvas dataURL = canvas.toDataURL('image/jpeg'); //转换为base64 // 将截取的视频图片设置为视频的背景 video.setAttribute("style", `background-image: url(${dataURL}); background-size: contain; background-position: center;background-repeat: no-repeat;`); } }
总结