大家有没有发现，小程序直播的方式在我们身边的会议、客户服务、约会中应用得越来越多……看到这些，不少开发者就着急了：怎样才能开发出例如小程序直播、小程序在线语音客服、小程序视频会议等等服务？

其实，这些玩得很6的小程序直播，都少不了它的支持——

2017年下半年，微信6.5.21版本支持在线音视频功能。开发者可以通过两个音视频组件<live-pusher>和 <live-player>实现实时地在线直播、视频通话、语音通话等功能。

本期小程序课，微信开发哥将详细为大家介绍一下音视频组件在线直播和视频通话这两个应用场景。

在线直播该怎么做？

1、在线直播的应用场景有哪些？

在游戏直播、远程授课、以及企业内部的培训分享等场景中，都可能会用到在线直播功能，直播的应用场景可以遍及各行各业。

比如微信电竞是一款游戏直播产品，以小程序为产品呈现方式。

比如在医疗行业，专家医师往往需要全国各地飞进行学术交流和培训，出差本身耽误了医生大量时间，在线远程授课能大大减少这里的时间耗用。

小程序中的 <live-pusher> 和 <live-player> 两个组件 ，都有一个叫做live ( <live-pusher> 中对应 mode 属性为 SD, HD, FHD)的模式，专门为在线直播而设计，通过小程序的音视频接口的live 模式，可以实现上述应用场景。

2、在线直播的内部原理是什么？

主播端使用 <live-pusher> ，它在微信小程序的内部是一个推流引擎，它负责对手机摄像头和麦克风的数据进行采集和编码，并通过 url 参数指定的 rtmp 推流地址上传到云端。

云端的作用类似信号放大器，它负责将来自主播端的一路音视频流数据进行放大，将数据实时并且无差异的负责并扩散到全国各地，从而解决主播和观众端之间距离太远（比如，跨地区和跨运营商）的问题。

观众端使用 <live-player> 进行播放，它在小程序的内部是一个在线播放器，负责从云端实时拉取音视频数据并进行解码和渲染。由于云端的放大效应，每一个观众都能在离自己比较近的云服务器上拉取到实时且流畅的音视频流。

3、我怎么用小程序实现在线直播？

step1：开通一个云直播服务（比如 腾讯云 ），或者自己搭建一个rtmp服务器（例如 nginx-rtmp 服务）。

step2：生成推流 url ,推流地址一般以 “rtmp://” 打头，比如  rtmp://8888.livepush.myqcloud.com/live/8888_test 就是一个典型 rtmp 推流 Url。

step3：为你的小程序增加一个 <live-pusher> 标签，并将 url 参数指定为你在 step2 中生成的推流 url。

同时， <live-pusher> 的 mode 参数可以指定为 HD 或者 FHD，这是在线直播场景中比较推荐的画质。

同时，你还可以通过 <live-pusher> 的 beauty 和 whiteness 等参数设定美颜和美白等级。

step4：生成推流 url 和播放地址，推流一般都是 rtmp:// 打头的 url，而播放地址则有两种选择，分别是 “rtmp://” 开头的 rtmp 播放协议，“http://” 打头和“.flv”结尾的的 http-flv 播放协议，推荐使用后者，因为这种播放地址各个云厂商都优化的比较好。

step5：为你的小程序增加一个 <live-player> 标签 ，并将 src 参数指定为你在 step4 中生成的播放 url。同时， <live-player> 的 mode 参数请指定为 live， orientation  和 object-fit 属性可以用于调整画面布局， min-cache 和 max-cache 则可以用于控制观众跟主播之间的延时大小，推荐的设置是 min-cache = 2， max-cache = 5。

关于在线直播，你会有这样的疑问

1、时延太高是怎么回事？

在线直播的延时跟播放协议和播放器参数有很大的关系， <live-player> 的 min-cache 和 max-cache 用于控制播放器端的最小时延和最大时延。其中，这里所说的“最小”和“最大”是根据观众端当时的网络情况而定的，如果网络情况比较好，那么播放器的时延就会趋向于 min-cache，而如果网络情况比较差，那么播放器的时延就会趋向于 max-cache。

另外，rtmp 协议 和 http-flv 协议的播放地址延时一般比较低，而 hls(m3u8)协议的延时则相对较高。

2、主播网络不好怎么办？

在一场直播过程中，如果观众端的网络不好，那么观看体验仅仅影响到当前观众；如果主播的网络不好，那么所有观众的观看体验都会很糟糕。