实时视频直播客户端技术盘点Native、HTML5、WebRTC、微信小程序( 三 )


好处有三点:

  • 1)开发成本低,开发周期短,基本和 H5 的开发难度差不多;
  • 2)很容易传播和获客,充分利用好微信的优质流量;
  • 3)可以推流和拉流,允许实现连麦直播和实时语音视频通话 。
【实时视频直播客户端技术盘点Native、HTML5、WebRTC、微信小程序】
不足有四点:
  • 1)你会受制于微信小程序的实时音视频能力,比如说,如果它的回声消除有某些问题,你只能等微信团队按照自己的节奏来优化,而自己没有任何办法去优化;
  • 2)小程序没有开放前处理接口,只能使用小程序自带的美颜或者变声功能(如果有),不能对接自行研发或者第三方的美颜或者变声模块;
  • 3)通过 RTMP 协议推流和拉流,不能和基于 UDP 的私有协议互通连麦 。如果要实现和基于 UDP 的私有协议互通连麦,就必须要增加接入层来转换协议格式甚至媒体格式;
  • 4)没有实现后端媒体服务器,开发者必须要自行实现媒体服务器,或者把微信小程序接入到第三方的实时通信网络 。

浏览器通过 WebRTC 开放了浏览器的实时音视频能力,而微信通过小程序开放了微信的实时音视频能力,在两个类操作系统的平台上允许开发者去实现连麦直播和实时音视频通话 。然而,无论 WebRTC 还是小程序只是在终端上带你入门,对开发者来说,要真正实现整套系统,还有很多工作需要做的 。
如果要将微信小程序接入实时音视频传输网络,中间得有接入服务器,我们叫接入层 。在接入层我们需要做协议的转换,比如说,如果实时音视频传输网络是使用基于 UDP 的私有协议,那么要把 RTMP 协议转为基于 UDP 的私有协议 。还有媒体格式的转换,如果和实时传输网络的媒体格式不一样,还需要进行转换 。
6、视频直播客户端技术之WebRTC 通过WebView接入小程序
还有别的方法在小程序上做连麦直播互动吗?必须要使用微信小程序开放的语音视频能力吗?也不一定 。下图展示了我在市面上看过的一个技术方案,它绕过了微信小程序实时语音视频能力,通过微信小程序 WebView 组件实现了连麦直播的方案 。这里和大家分享一下 。
实时视频直播客户端技术盘点Native、HTML5、WebRTC、微信小程序

文章插图
 
这个方案的基本思路是利用 WebView 的浏览器特点,在 WebView 内使用 WebRTC 的 Web API,从而在小程序上获得实时音视频能力 。上图是这个方案的架构图 。最底层是微信小程序的基础能力 。上一层是 WebView,微信小程序的 WebView 类似浏览器,那么就可能会支持 WebRTC 。然而必须要注意到,微信小程序的 WebView 在Android/ target=_blank class=infotextkey>安卓平台上支持 WebRTC,但在 iOS 平台上面不支持 WebRTC 。
虽然这个方案理论上也能在微信小程序上实现连麦直播,但是它有以下的局限性:
  • 1)在 iOS 平台上,微信小程序不支持这个方案,上面已经说过;
  • 2)小程序 WebView 不是完整的浏览器,要比普通浏览器表现差而且有很多的限制;
  • 3)开发者和操作系统之间隔了好几层:微信底层,小程序,WebView,WebRTC,然后才是开发者的小程序应用 。每一层的抽象都会带来性能上的消耗,都会影响到最终的体验 。

这个方案本质上还是一个基于 WebRTC 的解决方案,没有用到微信小程序开放的实时音视频能力,而是快速地借助 WebView 组件,剑走偏锋,十分讨巧地在微信小程序里使用了 WebRTC 。
7、本文小结
连麦直播技术逐步在原生 APP, 浏览器 H5,浏览器 WebRTC,微信小程序上延伸,衍生出更加丰富的生态,提供更加便捷和良好的用户体验,对视频直播平台和用户来说是好消息 。然而,欲带皇冠,必承其重 。特别是在浏览器 WebRTC 和微信小程序上,开发者要充分理解这些类型终端的特点和局限,才能更好地在上面利用连麦直播技术进行创新,服务用户 。




推荐阅读