关于H5播放视频文件的问题

m3u8文件是指UTF-8编码格式的M3U文件。M3U文件是记录了一个索引纯文本文件,打开它时播放软件并不是播放它,而是根据它的索引找到对应的音视频文件的路径进行播放。

简单说,播放器通过m3u8文件可以找到要播的具体音视频。

  格式如下是ts流文件

#EXTM3U
#EXT-X-VERSION:3
#EXT-X-ALLOW-CACHE:NO
#EXT-X-MEDIA-SEQUENCE:9350
#EXT-X-TARGETDURATION:10
#EXTINF:9.870
4cef7672d1-9350.ts
#EXTINF:9.875
4cef7672d1-9351.ts


安卓播放需要用video标签封装一下(现在大多安卓系统可以直接播放m3u8文件),ios播放可以直接播.m3u8文件!


Web上视频至今还没有统一的标准,目前大多是采用插件如flash,但是插件也没有统一标准。H5提供一种通过video标签来播放视频的标准,官方给出支持格式如下:(此处引用W3C详见W3C官网教程)

当前,video 元素支持三种视频格式:

格式 IE Firefox Opera Chrome Safari
Ogg No 3.5+ 10.5+ 5.0+ No
MPEG 4 9.0+ No No 5.0+ 3.0+
WebM No 4.0+ 10.6+ 6.0+ No

Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件

MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件

WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件


当然,经过个人实践,用video封装其它格式如MP4 也可以在某些浏览器上播放,官方给出三种支持格式可能是考虑兼容性问题。比如谷歌360都能直接播放H5封装的mp4(H264编码),单某些火狐版本却不支持。

但是在PC端,H5封装文件如大多直播流采用的.m3u8格式基本所有浏览器都不支持播放(自己编解码除外),所以H5的直播视频播放常用于手机端。

在这里顺便说一下H5对手机端的支持问题,封装mp4和封装.m3u8对手机型号及qq、微信、浏览器中播放等兼容性也有不同情况。

1.播放器播放按钮有些手机会出现、有些手机不显示;

2.自动播放有些手机不支持、设置autoPlay也要手动去点击才能触发播放;(ios:手动点击过一次后下次可以自动触发)

3.iphone上视频格式必须为mp4,直播为.m3u8,不支持flv,不支持rtmp协议(flash常用)的播放;

4.有些手机必须点击全屏才能触发播放;(低版本手机)

5.H5不能把多个视频合成一个视频播放,切片.m3u8除外;

6.小米4、小米4c、noto等系列,H5封装m3u8时,标签兼容性需要处理好,不能自动触发播放,需要js写一个点击触发H5播放器播放的函数去触发播放,否则播放不了,其它手机暂时未发现;

7.微信播放、qq播放虽然都是腾讯产品,播放也会有差别,微信兼容性需要特别注意,有些时候因为标签问题显示黑框无法播放;

8.各中手机自带浏览器播放样式会有很大区别,不建议使用过多标签控制样式;

9.横竖屏触发事件:windo.onoriertationchange在不同手机上有时会出现失灵现象,横竖屏后的操作可能未执行。


  • 5
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值