首页 > 其他分享 >截取视频video首帧为图片

截取视频video首帧为图片

时间:2023-11-30 09:25:21浏览次数:35  
标签:视频 canvas img 首帧 截取 video

 

this.url = "https://xxx.com/video/demo.mp4"

1.把视频放进canvas,在通过canvas 拿到视频的第一帧。

var cut = function() {
    let canvas = document.createElement("canvas");//创建画布
    canvas.width = video.videoWidth * scale;
    canvas.height = video.videoHeight * scale;//设定宽高比
    canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height);//将视频此刻帧数画入画布
    let img = document.createElement("img");
    img.src = canvas.toDataURL("image/png");
    Dom.appendChild(img);//写入到Dom
};
video.addEventListener('loadeddata',cut);//在视频帧数已加载时执行截取

 

2.通过拼接属性获取视频首帧图片

this.cover = this.videoUrl + "?x-oss-process=video/snapshot,t_1,m_fast"
this.videoCover 就直接可以在vue里作为封面来用。

 

标签:视频,canvas,img,首帧,截取,video
From: https://www.cnblogs.com/coder-Fish/p/17866495.html

相关文章

  • 好用的视频修复软件DVR(Digital Video Repair)
    使用EV录屏时进程中止导致已录的视频也打不开,可以试试有录好的小视频可以作为辅助信息提高修复成功率。https://www.risingresearch.com/en/dvr/......
  • 7 Mutilmodal Feature Extraction and Attention-based Fusion for Emotion Estimatio
    摘要。人机交互技术的不断进步,使得情感的计算成为可能。在本文中,我们介绍了我们提交给CVPR2023竞赛的情感行为分析在野外(ABAW)。人机交互中的情感分析应尽可能从多维度入手,填补单个不完善的情感通道,最后通过拟合多个结果确定情感倾向。因此,我们利用了从比赛数据集中不同长度的视......
  • python 截取xlsx文件中某个时间段的数据
    Python截取xlsx文件中某个时间段的数据引言在日常工作和数据分析中,我们经常需要处理各种各样的数据文件。而其中一种较为常见的文件格式是Excel文件,尤其是.xlsx文件。Python作为一种强大的编程语言,提供了丰富的库和工具来处理Excel文件。本文将介绍如何使用Python截取.xlsx文件中......
  • 新火种AI | Stable Video Diffusion来了!普通人拍大片指日可待
    作者:小岩随着技术的不断进步,AI领域取得了巨大的突破。特别是在图片生成这个赛道,AI目前能做到的成绩超乎想象。或许就在1年以前,很多人,特别是一些专业从业者对AI绘画的印象还停留在“元素要靠东拼西凑”“废图率太高”“成品无法直接使用”等方面,但如今,高质量AI绘图软件的表现完全可......
  • 软件编程 ---- 截取网页
     #从Selenium和concurrent.futures导入必要的模块和类fromseleniumimportwebdriverfromselenium.webdriver.chrome.optionsimportOptionsfromconcurrent.futuresimportThreadPoolExecutorimportconcurrent.futures.thread#定义一个函数,用于捕获整个页面的截......
  • 直播平台源码,vue图片中划框截取部分图片
    直播平台源码,vue图片中划框截取部分图片 <template> <div>  <el-dialogtitle="请在图片上画出需要新增故障的位置":visible.sync="dialogVisible"width="1270px":before-close="handleClose":close-on-click-modal="false":close......
  • JAVA 截取字符串的几种方法
    使用String类的substring()方法可以使用substring()方法来截取字符串中的一部分,它需要传入两个参数,第一个参数是起始位置,第二个参数是结束位置(不包含结束位置的字符)。例如:Stringstr="Hello,World!";Stringsubstr=str.substring(7,12);//World使用String类的s......
  • Java字符串分割[split()]和截取[substring()]
    字符串的分割:一般自字符串的分割常用的方法是java.lang包中的String.split()方法,返回是一个字符串数组。语法:publicString[]split(Stringregex,intlimit)参数:regex -- 正则表达式分隔符。limit --分割的份数。比如:需要分割字符串中的每个字符(空格也会被看做字符),split()中......
  • .NET 8 Video教程介绍(开篇)
    教程简介本文将简单描述视频网站教程,视频网站是一个类似于腾讯视频一样的网站,视频资源用户自己上传,然后提供友好的界面查看视频和搜索视频,并且提供管理页面对于视频进行管理,我们将使用Blazor作为前端,并且由MasaFramework作为后端框架,一般情况下我们需要做简单的权限管理,对于用户......
  • 你真的了解字符截取函数substr吗?php字符截取函数substr参数的6种情况。分别是:正正 负
    <?php$str='123456789abcd';echo'<br/>';echo'原字符:'.$str;echo'<br/>';//情况1正正++从指定位置开始截取3个echo'1正正substr($str,0,3):'.substr($str,0,3);//123echo'<br/>';//情况2......