前天分享一篇​​网页视频播放​​的文章,有人提出了视频播放地址从哪里获取的问题,那今天详细回答一下这个问题。

视频点播地址格式

视频点播地址是网络上的视频地址,是一个可以获取视频流数据的url地址。使用网页播放器、APP播放器等可以从这个地址获取视频数据进行播放。

视频点播的url地址由​​视频点播服务器​​(也就流媒体服务器)发布,一般包括多种播出协议,如http、rtp、rtmp、rtsp等,目前在网站上播放的视频地址绝大部分为http协议的视频地址,包括http-mp4地址、hls地址、http-flv地址等。你可以自己搭建视频点播服务器,也可以使用第三方平台提供的视频点播服务器来存放视频并获取视频点播地址。

以云视睿博的流媒体服务器为例,输出的视频点播url地址通常是如下格式:

流媒体服务器 NTV Media Server G3视频点播地址:
hls(m3u8) 地址:
http://www.ruiboyun.net/vod/vod3/e0u83v08/index.m3u8
http-mp4地址:
http://www.ruiboyun.net/mp4/vod/9npkladw/mp4/index.mp4
http-flv地址:
http://www.ruiboyun.net/live/show/e0u83v08/index.flv

这些地址可以由流媒体服务器输出,也可以由CDN加速后输出,播放器端播放方式是一样的。

网页集成方式

由于使用的是http播出协议,有遵循的是开放的标准,因此以上视频点播地址可以通过HTML5的video标签进行播放,不需要装任何插件。例如:

<video src="http://xxx.ruiboyun.net/vod/vod3/e0u83v08/index.m3u8" controls="controls">
</video>

当然,为了美观,可以用css调整video标签的大小等属性。

除了使用video标签,还有更通用的播放方式,那就是使用上一篇文章我们介绍的网页播放器来播放。

为什么要使用网页播放器呢? 因为尽管移动端浏览器(包括微信、QQ等内嵌的浏览器)都支持m3u8地址,但是有些PC端浏览器并不支持播放m3u8地址,因此要使用支持这种地址的播放器来播放。注意,虽然名字叫“播放器”,其实并不是插件,而是纯js代码,因此你依然不需要安装任何插件。

使用网页播放器的另一个好处是具有更强的功能和更好的扩展性,其灵活性和功能是使用video标签没法做到的。

以云视睿博的流媒体服务器提供的播放样例代码为例,一个网页播放器的使用大致如下:

<!-- 播放区域,通过调整样式设置合适的大小和位置 -->
<div id="video_div" style="width: 640px;height: 360px">

<!-- 实现播放器的js代码 -->
<script src="uplayer.min.js"></script>
<script>
play("http://www.ruiboyun.net/vod/vod/3bahma4c/index.m3u8","video_div","hls");
</script>

其实仅需需要几行代码,集成起来还是很简单的。

关于视频转码

为什么要进行视频转码呢?我们知道,使用高清数码摄像机和手机等数码产品拍摄的视频,码率(比特率)通常很大,一般在8Mbps和30Mbps之间,以现有的移动网络带宽播放这些视频通常比较吃力,也会消耗较大的用户流量,同时视频服务器的网络负载也会非常大。为了提高视频播放的流畅度、降低用户流量,需要对视频进行降码率处理,这个过程由流媒体服务器的转码功能实现,通常在保持清晰度没有太大降低的情况下,码率可以降低60%以上。

使用云视睿博的流媒体服务器对视频进行转码,通常高清视频(1080p)的码率降低到2Mpbs到3Mbps之间,与原始视频对比码率大大降低。

视频点播服务器实现视频转码和视频播出功能_网页视频播放

视频转码

可以看到,转码码率降低到2Mbps左右。

视频点播服务器实现视频转码和视频播出功能_流媒体服务器_02

更多延伸阅读,请关注本人51cto博客哦,有用请点赞。