HTML5的Video标签有部分MP4无法播放的问题解析(多图)


Posted in HTML / CSS onAugust 18, 2017

现在网页视频的应用极为广泛,在实际项目中发现有些MP4文件可以在H5网页中正常播放,但有些却不行,这是为什么呢?

1、首先我自己从网上下载的一个MP4文件,IE10和谷歌都能正常播放。然后自己用格式化工厂转换了一个RMVB文件为MP4,然后就不能播放。

如下图,我选择MP4格式转换,里面的配置文件也调了很多遍,但是就是播放不了,IE10完全没反应,谷歌倒是能出声音,但是影像出不来。

HTML5的Video标签有部分MP4无法播放的问题解析(多图)

2、我直接在文件右击属性里面看文件属性-详细信息,基本都一样。

3、我用potplayer播放两个不同的文件,用potplayer查看2个文件的属性,发现了不一样的地方,

网上下载的能正常使用video标签播放的视频属性如下图

HTML5的Video标签有部分MP4无法播放的问题解析(多图)

我们可以看到视频编码是AVC

而我自己用格式化工厂转码的视频编码如下

HTML5的Video标签有部分MP4无法播放的问题解析(多图)

发现我自己转码的视频编码是mp4v。

4、在格式化工厂里面找到AVC编码的格式,如下图

HTML5的Video标签有部分MP4无法播放的问题解析(多图)

5、选用AVC格式的编码,重新转码后,使用video标签播放就可以正常播放了。

归根结底,还是视频编码格式的问题,并不是网页程序的问题。

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助~如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持!

HTML / CSS 相关文章推荐
CSS3动画效果回调处理详解
Dec 10 HTML / CSS
详解CSS中iconfont的使用
Aug 04 HTML / CSS
Css3新特性应用之形状总结
Dec 08 HTML / CSS
深入理解css中vertical-align属性
Apr 18 HTML / CSS
利用CSS3伪元素实现逐渐发光的方格边框
May 07 HTML / CSS
CSS3实现线性渐变用法示例代码详解
Aug 07 HTML / CSS
html5应用缓存_动力节点Java学院整理
Jul 13 HTML / CSS
HTML5的自定义属性data-*详细介绍和JS操作实例
Apr 10 HTML / CSS
Html5中localStorage存储JSON数据并读取JSON数据的实现方法
Feb 13 HTML / CSS
HTML5 localStorage使用总结
Feb 22 HTML / CSS
HTML5中的拖放实现详解
Aug 23 HTML / CSS
有关HTML5页面在iPhoneX适配问题
Nov 13 HTML / CSS
HTML5 Canvas 旋转风车绘制
Aug 18 #HTML / CSS
HTML5 LocalStorage 本地存储详细概括(多图)
Aug 18 #HTML / CSS
HTML5 移动页面自适应手机屏幕四类方法总结
Aug 17 #HTML / CSS
HTML5新增属性data-*和js/jquery之间的交互及注意事项
Aug 08 #HTML / CSS
html5 canvas合成海报所遇问题及解决方案总结
Aug 03 #HTML / CSS
从零实现一个自定义html5播放器的示例代码
Aug 01 #HTML / CSS
浅谈HTML5 服务器推送事件(Server-sent Events)
Aug 01 #HTML / CSS
You might like
用PHP和ACCESS写聊天室(九)
2006/10/09 PHP
php 禁止页面缓存输出
2009/01/07 PHP
CI框架中$this->load->library()用法分析
2016/05/18 PHP
Smarty简单生成表单元素的方法示例
2016/05/23 PHP
laravel学习笔记之模型事件的几种用法示例
2017/08/15 PHP
JS IE和FF兼容性问题汇总
2009/02/09 Javascript
用showModalDialog弹出页面后,提交表单总是弹出一个新窗口
2009/07/18 Javascript
Jquery 表单取值赋值的一些基本操作
2009/10/11 Javascript
用js闭包的方法实现多点标注冒泡示例
2014/05/29 Javascript
Jquery结合HTML5实现文件上传
2015/06/25 Javascript
纯jquery实现模仿淘宝购物车结算
2015/08/20 Javascript
checkbox批量选中,获取选中项的值的简单实例
2016/06/28 Javascript
jQuery解析与处理服务器端返回xml格式数据的方法详解
2016/07/04 Javascript
js 判断一组日期是否是连续的简单实例
2016/07/11 Javascript
js原生Ajax的封装和原理详解
2017/03/11 Javascript
纯原生js实现贪吃蛇游戏
2020/04/16 Javascript
详解node-ccap模块生成captcha验证码
2017/07/01 Javascript
vue2.0 实现导航守卫(路由守卫)
2018/05/21 Javascript
Angular使用cli生成自定义文件、组件的方法
2018/09/04 Javascript
[04:56]经典回顾:前Ehome 与 前LGD
2015/02/26 DOTA
Python pickle模块用法实例
2015/04/14 Python
Python 文件处理注意事项总结
2017/04/10 Python
python中利用Future对象回调别的函数示例代码
2017/09/07 Python
python 将md5转为16字节的方法
2018/05/29 Python
Python实现FTP弱口令扫描器的方法示例
2019/01/31 Python
python 发送json数据操作实例分析
2019/10/15 Python
python数据预处理 :数据抽样解析
2020/02/24 Python
在python里创建一个任务(Task)实例
2020/04/25 Python
如何在Canvas上的图形/图像绑定事件监听的实现
2020/09/16 HTML / CSS
骨干教师考核方案
2014/05/09 职场文书
地质灾害防治方案
2014/05/14 职场文书
实现中国梦思想汇报2014
2014/09/13 职场文书
工作散漫检讨书
2014/09/16 职场文书
2014预防青少年违法犯罪工作总结
2014/12/10 职场文书
初中生思想道德自我评价
2015/03/09 职场文书
输入框跟随文字内容适配宽实现示例
2022/08/14 Javascript