浏览器播放hls视频流的解决方案
HLS (HTTP Live Streaming),Apple的动态码率自适应技术。主要用于PC和Apple终端的音视频服务。包括一个m3u(8)的索引文件,TS媒体分片文件和key加密串文件。
hls流在非苹果的PC机上只有微软的Edge支持,但三大移动平台上的支持都非常不错,因此在chrome等众多PC浏览器上需要使用flash进行编码后再播放给用户。在nplive中选用了强大的jwplayer(从iptv找到了破解版,再次感谢网络中心),通过js调用。
这里由于flash有着对访问对象的跨域限制,如果访问目标根目录的crossdomain.xml没有允许该访问来源或不存在crossdomain.xml,flash将不能访问目标资源,因此需要在每台推流服务器根目录部署crossdomain.xml,并允许*.bitnp.net的访问来源。
1 2 3 | <cross-domain-policy> <allow-access-from domain="*.bitnp.net"/> </cross-domain-policy> |
flash在移动设备上的支持不好,所以这里有必要对访问者的设备类型作一个判断。首先想到的就是通过User-Agent来进行判断。但由于浏览器和设备标识过于繁多且很可能在判断时出现疏漏,nplive采用了较为成熟的轻量级的Mobile-Detect(https://github.com/serbanghita/Mobile-Detect)和一个简单的index.php文件对访问者进行了判断,Mobile-Detect有着比较全面和准确的UA识别功能。
区分出来的移动端用户将被跳转到移动版的页面,视频播放是以video.js和html5中的video标签实现的,目前大多数浏览器都支持video标签,同时移动设备能够支持hls视频流,这样就解决了hls的全平台播放问题。
共有 0 条评论