微信小程序开发须要基于微信提供的开发者工具与 SDK。若是开发者对小程序开发流程不熟悉,建议先系统学习:微信小程序开发官方文档。javascript
因为微信官方文档比较详细,本文对小程序开发流程中的框架说明、API 调用、组件使用等,再也不赘述,而是重点介绍如何使用 ZEGO SDK 开发出支持音视频直播的微信小程序。css
SDK 集成指引详见:微信小程序 SDK集成指引html
SDK 提供的 API 说明详见:微信小程序 SDK API 说明java
小程序开发主要用到 web 开发知识( js、html、css )。web
一、组件说明小程序
微信小程序中的推拉流功能,须要用到微信提供的 live-player live-pusher 标签。其余的常规组件同原生 App 开发相似,此处不一一介绍。微信小程序
1.1 live-player微信
live-player 是微信提供的支持实时音视频播放的组件,官方介绍详见组件介绍。websocket
开发者建立组件成功后,须要在 js 文件中,调用 API 操做对应的组件来实现需求,微信官方 API 详见 API 说明。框架
即构音视频云小程序中,建立 live-player 的演示源码以下:
ZegoLive/pages/liveroom/room/room.wxml <live-player autoplay wx:if="{{item.playUrl}}" id="{{item.streamID}}" mode="RTC" object-fit="fillCrop" min-cache="0.1" max-cache="0.3" src="{{item.playUrl}}" debug="{{pushConfig.showLog}}" bindstatechange="onPlayStateChange" bindnetstatus="onPlayNetStateChange" binderror="error"> <cover-view class='character' style='padding: 0 5px;'>{{item.streamID}}</cover-view> </live-player>
请注意:
live 模式主要用于直播类场景,好比赛事直播、在线教育、远程培训等等。该模式下,小程序内部的模块会优先保证观看体验的流畅,经过调整 min-cache 和 max-cache 属性,您能够调节观众(播放)端所感觉到的时间延迟的大小,文档下面会详细介绍这两个参数。
RTC 则主要用于双向视频通话或多人视频通话场景,好比金融开会、在线客服、车险定损、培训会议 等等。在此模式下,对 min-cache 和 max-cache 的设置不会起做用,由于小程序内部会自动将延迟控制在一个很低的水平(500ms 左右)。
1.2 live-pusher
live-pusher 是微信提供的支持实时音视频录制的组件,官方介绍详见:组件介绍
开发者建立组件成功后,须要在 js 文件中,调用 API 操做对应的组件来实现需求,官方 API 详见:API 说明