萤⽯云rtmp格式直播流在H5端App开发的踩坑经历
背景
之前在开发公司项⽬的时候,有⼀个需求是要开发实时的监控直播⽤于监控医院和⽔质站点的情况,视频直播使⽤的是rtmp直播流协议结合⼀个⽹页播放插件SewisePlayer,该协议⽀持实时监控播放,然后在这个基础上结合公司项⽬业务需求进⾏⼆次开发。
⼀开始的回放⼀直在PC端做web应⽤,并且在PC端浏览器视频回放没有任何问题,都是顺风顺⽔,后来有⼀个需求是要在app端同时也开发⼀个可以观看监控的功能。因为我们的app都是安卓外壳内嵌h5页⾯,基本上之前的做法都是按照原有的接⼝,对界⾯进⾏适配移动端就可以了,反正移动端PC端最终使⽤的都是H5。所以带着这个思路就开始做这个移动端视频直播流的功能,使⽤的插件什么的都没变化。等把接⼝之类的开发完毕,界⾯适配完毕,对接接⼝的时候,却发现在进⾏移动端进⾏调试的时候,直播死活播放不出来。⼀直报这个错误。
Failed to load resource: net::ERR_UNKNOWN_URL_SCHEME
Uncaught (in promise) DOMException: Failed to load because no supported source was found.
过程
就开始很奇怪,为什么在pc端浏览器都没这个问题,正常的⼀匹,看这个报错的意思是未知的范围,不⽀持这种源之类的问题。然后带着报错去百度查,有说移动端浏览器只⽀持http、https的,还有说插件问题的,然后花了⼤量的时间去解决⽅案解决这个问题,甚⾄还换了很多播放插件,均没有解决。最后⽆奈去直播流提供⽅,萤⽯云官⽹的开发⽂档有没有什么替代⽅案。在搜寻过程中发现了这个表格才惊醒!
跨平台⽐较
协议\对⽐移动端桌⾯端Html5Web综合评分
EZOPEN⽀持⽀持X⽀持★★★★
HLS⽀持⽀持⽀持⽀持★★★★★
RTMP X⽀持X⽀持★★
注意:RTMP移动端仅Android系统⽀持
扩展性⽐较
协议\对⽐⼆次开发三⽅CDN集成三⽅视频云集成综合评分
EZOPEN⽀持X X★★
HLS⽀持X⽀持★★★
RTMP⽀持⽀持⽀持★★★★
原来RTMP根本就不⽀持H5播放,然后去搜了⼀下RTMP的有关知识
RTMP协议简介
RTMP(Real Time Messaging Protocol)实时消息传送协议,是Adobe Systems公司为Flash播放器和服务器之间⾳频、视频和数据传输开发的开放协议。萤⽯⽀持以rtmp链接的形式播放设备的实时视频。
兼容性
标准流并不能在所有系统或者移动设备上使⽤,系统⽀持情况如下:
小视频app开发协议\系统iOS Android IE Safari Firefox
HLS⽀持⽀持⽀持⽀持⽀持
RTMP X⽀持⽀持⽀持⽀持注意:RTMP依赖Flash Player
解决⽅案
看到这⾥就明了了,RTMP只能在Flash播放。之前⼀直都是被⼀个思维固化所限制,都是H5播放,为什么pc可以,切换成移动端视图就不⾏了呢。现在我个⼈猜测是,由于pc端浏览器更为强⼤,当识别到是RTMP协议的时候,就会⾃动调⽤Flash进⾏播放,⽽在App端嵌⼊的浏览器则没有这么强⼤的功能,因此会报错导致⽆法播放。既然H5端不能直接播放,所以想在移动端的直接通过H5播放rtmp格式的直播流是⽆解的,那么最后的解决⽅案就是,通过和公司安卓开发协调,调⽤Andriod原⽣的播放器,传⼊视频地址进⾏播放,因为安卓的原⽣是⽀持Flash的。
1.当出现问题时不要被表象限制,打破⾃⼰的固有思维反⽽是解决问题的途径。
2.到问题的根本原因,不要浮在表⾯
3.尽量去官⽅⽂档答案
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论