关于javascript:js-截取视频第一帧转成File图片格式

1.电脑系统 win11专业版
2.开发环境 vue2+element
3.在开发的过程中,咱们会遇到截取视频第一帧转换成图片的需要,上面我来分享一下办法:

// 上传视频的时候调用对应的办法videoRef.oncanplay = () => {    let canvas = document.createElement("canvas");    let ctx = canvas.getContext('2d');    canvas.width = videoRef.clientWidth; // 获取视频宽度    canvas.height = videoRef.clientHeight; // 获取视频高度    // 利用canvas对象办法绘图    ctx.drawImage(videoRef, 0, 0, videoRef.clientWidth, videoRef.clientHeight);    // 转换成base64模式    const imgBase64 = canvas.toDataURL("image/png");    const fileName = resultFileName + ".png";    console.log(dataURLtoFile(imgBase64,fileName));        //生成对应的file文件    const fileData = dataURLtoFile(imgBase64,fileName);}

export const dataURLtoFile = (dataurl, fileName) => {    let binary = atob(dataurl.split(",")[1]);    let mime = dataurl.split(",")[0].match(/:(.*);/)[1];    let array = [];    for (let i = 0; i < binary.length; i++) {        array.push(binary.charCodeAt(i));    }    let fileData = new Blob([new Uint8Array(array)],{        type:mime    });    return new File([fileData],fileName,{type:mime});}

99.本期的分享到了这里就完结啦,心愿对你有所帮忙,让咱们一起致力走向巅峰。