首页 前端知识 H5的Video标签无法播放MP4文件只有声音无画面

H5的Video标签无法播放MP4文件只有声音无画面

2024-04-08 23:04:40 前端知识 前端哥 475 80 我要收藏

最近在项目中碰到了一个问题:

在利用H5的video标签播放视频时,发现有的视频可以正常播放,但有的只有声音没有画面。

问题发现

为了测试一下,具体是标签用法原因,还是视频文件本身的原因,我将相同的视频文件引入标签,和直接拖入浏览器进行访问。

若直接可以在video标签时,则在浏览器中也可以播放,当在video标签中只有声音没有画面时,浏览器中播放也是如此,因此得知这是文件源的原因,与video本身写法无关。

首先video标签支持的视频格式如下:

  • MP4 = MPEG 4文件使用 H264 视频编解码器和AAC音频编解码器

  • WebM = WebM 文件使用 VP8 视频编解码器和 Vorbis 音频编解码器

  • Ogg = Ogg 文件使用 Theora 视频编解码器和 Vorbis音频编解码器

 所以我们在网页中遇到的问题其实就是视频流解析不成功,即视频编码不符合要求。

解决方法

使用video标签时,不能被播放的视频的编码格式不是h264,因此当网页播放mp4视频时,出现有声音无图像问题的时候,可以先使用格式工厂转换格式,将输出编码选择AVC(H264),然后再进行调用。

转载请注明出处或者链接地址:https://www.qianduange.cn//article/4642.html
标签
评论
发布的文章

JQuery中的load()、$

2024-05-10 08:05:15

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!