小程序直播带货app源码直播组件接入指引
一、简介
小程序直播带货系统,是微信提供给小程序开发者的直播组件。通过调用该组件,商家可以在直播带货app源码中实现直播功能。
按下面的使用说明接入,在你的直播带货app源码中引入直播组件。
二、使用方法说明
1. 【直播组件】如何引入
版本限制:
微信客户端版本 7.0.7 及以上(基础库版本2.9.x 及以上支持同层渲染)可以观看直播及使用直播间的功能,低版本刚进入直播间时会提示用户升级微信客户端版本(低版本只能观看直播,无法使用直播间的功能)。
在分包内引入【直播组件】live-player-plugin代码包,项目根目录的 app.json 引用,示例直播带货app源码如下:
{
"subpackages": [
{
"root": "packageA",
"pages": [
"pages/home/home"
],
"plugins": {
"live-player-plugin": {
"version": "1.0.0", // 填写该直播组件最新版本号,微信开发者工具调试时可获取最新版本号
"provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid,该示例值即为直播组件appid
}
}
}
]
2. 【直播组件】如何使用
按第1步的方法把组件代码包配置引入后,即可直接通过链接地址跳转到直播组件页面(即为进直播间页面)链接地址需要带上直播房间id;房间id可通过下面【获取直播房间列表】API获取,示例直播带货app源码如下:
<navigator url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]">
Go to Live Player page
</navigator>
通过该链接可跳转到直播组件页面(当前页面入口仅开放‘live-player-plugin’)。
示例效果图如下:
三、其他相关组件、接口和携带参数
● 订阅组件:subscribe
● 获取直播状态API:getLiveStatus
● 直播间到商详页面携带参数:room_id
● 从群分享卡片返回直播间时携带参数:shareTicket
● 后台获取直播房间列表API
● 后台获取回放源视频API
注:以上2个后台调用的接口总上限500次/天
1. 【订阅】组件
功能解释:
用户进入直播间内,可对一场未开播的直播进行单次订阅,开播时直播组件会自动下发开播提醒给用户,无需开发者额外开发
组件使用:
如果需要在直播组件页以外小程序其他页面也有同样的开播提醒的功能,可以引入【订阅】组件subscribe;需在page页面(如home页面)的 home.json 引用订阅组件,示例直播带货app源码如下:
{
"usingComponents": {
"subscribe": "plugin-private://wx2b03c6e691cd7370/components/subscribe/subscribe"
}
}
然后便可在home.wxml里使用订阅组件,其中直播房间id可通过;房间id可通过下面【获取直播房间列表】API获取
<subscribe room-id="[直播房间id]"></subscribe>
2. 【获取直播状态】接口
接口说明:
首次获取立马返回直播状态,往后间隔1分钟或更慢的频率去轮询获取直播状态;
直播状态说明:
l 101直播中:表示主播正常开播,直播正常的状态;
l 102未开始:表示主播还未开播;
l 103已结束:表示在直播端点击【结束】按钮正常关闭的直播,或直播异常15分钟后系统强制结束的直播;
l 104禁播:表示因违规受到运营处罚被禁播;
l 105暂停中:表示在MP小程序后台-控制台内操作暂停了直播;
l 106异常:表示主播离开、切后台、断网等情况,该直播被判定为异常状态,15分钟内恢复即可回到正常直播中的状态;如果15分钟后还未恢复,直播间会被系统强制结束直播;
l 107已过期:表示直播间一直未开播,且已达到在MP小程序后台创建直播间时填写的直播计划结束时间,则该直播被判定为过期不能再开播;
调用方法:
若要调用【获取直播状态】接口getLiveStatus,需在小程序页面顶部引用【直播组件】live-player-plugin,示例代码如下:
let livePlayer = requirePlugin('live-player-plugin') // 引入获取直播状态接口
// 首次获取立马返回直播状态,往后间隔1分钟或更慢的频率去轮询获取直播状态
const roomId = xxx
// 房间id
livePlayer.getLiveStatus({ room_id: roomId })
.then(res => {
//
101: 直播中, 102: 未开始, 103: 已结束,
104: 禁播, 105: 暂停中, 106: 异常,107:已过期
const
liveStatus = res.liveStatus
})
.catch(err =>
{
console.log(err)