返回

移动端H5直播点播的开发与实践

前端

企鹅辅导是腾讯推出的针对小学、初中、高中课外的在线学习服务平台。近期,企鹅辅导为了方便用户更加快速便捷地上课,新增了移动端H5的上课形式。本文主要介绍了H5“实时直播”和“点播”的选型,以及开发过程中遇到的问题和解决方案。

企鹅辅导的上课功能是产品较为核心的功能,而原有上课方式是通过原生APP的方式提供上课服务,这种方式虽然上课体验好,但是成本高、开发周期长,同时还会受到终端设备的限制。因此,企鹅辅导希望能够通过H5的方式来提供上课服务,这样不仅可以降低成本、缩短开发周期,还可以打破终端设备的限制,让用户可以在任何设备上随时随地上课。

H5直播的选型

H5直播的选型主要考虑以下几个因素:

  • 直播协议: 目前主流的直播协议有RTMP、HLS、FLV等。其中,RTMP协议是目前最常用的直播协议,它具有延迟低、稳定性高的特点,但缺点是它只支持单播,不能支持多播。HLS协议是一种流媒体传输协议,它可以支持多播,但它的延迟相对较高。FLV协议是一种基于HTTP的流媒体传输协议,它具有延迟低、稳定性高的特点,但缺点是它只支持单播。
  • 直播服务器: 直播服务器是负责接收主播端推流并将其转码成可以被客户端播放的格式的服务器。目前主流的直播服务器有Wowza、Nginx-RTMP、Red5等。其中,Wowza是一款商用直播服务器,它具有强大的功能和稳定的性能,但缺点是价格昂贵。Nginx-RTMP是一款开源直播服务器,它具有轻量级、高性能的特点,但缺点是功能相对较弱。Red5是一款开源直播服务器,它具有功能强大、性能稳定的特点,但缺点是配置相对复杂。
  • 直播客户端: 直播客户端是负责播放直播流的客户端。目前主流的直播客户端有H5Player、MSE Player、Video.js等。其中,H5Player是一款开源直播客户端,它具有轻量级、高性能的特点,但缺点是功能相对较弱。MSE Player是一款开源直播客户端,它具有功能强大、性能稳定的特点,但缺点是配置相对复杂。Video.js是一款商用直播客户端,它具有强大的功能和稳定的性能,但缺点是价格昂贵。

经过综合考虑,企鹅辅导最终选择了使用RTMP协议、Nginx-RTMP服务器和H5Player客户端来实现H5直播。

H5点播的选型

H5点播的选型主要考虑以下几个因素:

  • 点播协议: 目前主流的点播协议有HTTP、HLS、FLV等。其中,HTTP协议是最常用的点播协议,它具有简单易用、成本低廉的特点,但缺点是它的延迟相对较高。HLS协议是一种流媒体传输协议,它可以支持多播,但它的延迟相对较高。FLV协议是一种基于HTTP的流媒体传输协议,它具有延迟低、稳定性高的特点,但缺点是它只支持单播。
  • 点播服务器: 点播服务器是负责存储点播视频并将其传输给客户端的服务器。目前主流的点播服务器有VOD、CDN等。其中,VOD是一款商用点播服务器,它具有强大的功能和稳定的性能,但缺点是价格昂贵。CDN是一款分布式点播服务器,它具有高并发、低延迟的特点,但缺点是配置相对复杂。
  • 点播客户端: 点播客户端是负责播放点播视频的客户端。目前主流的点播客户端有H5Player、MSE Player、Video.js等。其中,H5Player是一款开源点播客户端,它具有轻量级、高性能的特点,但缺点是功能相对较弱。MSE Player是一款开源点播客户端,它具有功能强大、性能稳定的特点,但缺点是配置相对复杂。Video.js是一款商用点播客户端,它具有强大的功能和稳定的性能,但缺点是价格昂贵。

经过综合考虑,企鹅辅导最终选择了使用HTTP协议、CDN服务器和H5Player客户端来实现H5点播。

开发过程遇到的问题和解决方案

在开发过程中,企鹅辅导遇到了以下几个问题:

  • 直播延迟问题: H5直播的延迟相对较高,这主要是由于RTMP协议的特性造成的。为了降低直播延迟,企鹅辅导采取了以下措施:
    • 优化直播服务器的配置,提高服务器的性能。
    • 使用CDN来分发直播流,降低直播流的传输延迟。
    • 使用H5Player客户端的低延迟播放功能,降低播放延迟。
  • 点播卡顿问题: H5点播的卡顿问题主要是由于网络原因造成的。为了解决这个问题,企鹅辅导采取了以下措施:
    • 使用CDN来分发点播视频,降低点播视频的传输延迟。
    • 使用H5Player客户端的抗卡顿功能,降低播放卡顿的概率。
  • 兼容性问题: H5直播和点播需要兼容各种浏览器和设备。为了解决这个问题,企鹅辅导采取了以下措施:
    • 使用H5Player客户端的跨浏览器兼容功能,确保直播和点播可以在各种浏览器上播放。
    • 使用H5Player客户端的跨设备兼容功能,确保直播和点播可以在各种设备上播放。

通过以上措施,企鹅辅导成功地解决了H5直播和点播开发过程中遇到的各种问题,并实现了H5直播和点播的顺利上线。