1.添加直播组件
以mpvue为例
//app.json
"plugins": {
"live-player-plugin": {
"version": "1.0.11",
"provider": "wx2b03c6e691cd7370"
}
}
直播组件版本号可以在 微信开发者工具-详情-基本信息-插件信息
查看当前版本号以及最新版本号
2.直播间跳转
以navigateTo为例
let roomId = [直播房间id] // 填写具体的房间号
let customParams = encodeURIComponent(JSON.stringify({
path: 'pages/index/index',
pid: 1
})) // 开发者在直播间页面路径上携带自定义参数
let livePath = 'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin'
wx.navigateTo({// 其中wx2b03c6e691cd7370是直播组件appid不能修改
url: `${livePath}?room_id=${roomId}&custom_params=${customParams}`
})
3.获取直播间列表以及获取直播状态
直播间列表调用限额
500
次/天,建议开发者自己做缓存,交给后端处理了!
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
console.log('get live status', liveStatus)
}).catch(err => {
console.log('get live status', err)
})
4.直播订阅
对于未开播场次进行订阅
//页面json文件添加subscribe组件
usingComponents: {
subscribe: 'plugin-private://wx2b03c6e691cd7370/components/subscribe/subscribe'
}
//写入直播房间id即可
<subscribe room-id="[直播房间id]"></subscribe>
5.mpvue-config-loader大坑
插件简化了页面config配置,但在 usingComponents
遍历的时候为所有属性值添加了一个 /
,就导致获取不到 subscribe
组件,暂时先对 mpvue-config-loader
插件做一下更改。
//node_modules/mpvue-config-loader/index.js 46-48行
//可将其3行注释掉,或者去掉47行 /
if (parentKey === 'usingComponents' && !path.isAbsolute(node.value)) {
return `/${node.value}`
}
6.获取分享卡片链接参数
以mpvue为例,在
./src/App.vue
文件中添加以下代码
onShow(options) {
// 分享卡片入口场景才调用getShareParams接口获取以下参数
if (options.scene == 1007 || options.scene == 1008 || options.scene == 1044) {
livePlayer.getShareParams().then(res => {
console.log('get room id', res.room_id) // 房间号
console.log('get openid', res.openid) // 用户openid
console.log('get share openid', res.share_openid) // 分享者openid
console.log('get custom params', res.custom_params) // 自定义参数
}).catch(err => {
console.log('get share params', err)
})
}
}
可以收集进入直播间的用户以及分享者的信息
7.其它途径进入直播间
直播间小程序码
// type=9 小程序码
"plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]&type=9"
// 添加自定义参数 custom_params
"...&custom_params=encodeURIComponent(JSON.stringify(custom_params))"
公众号小卡片
// type=10 小卡片
"plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]&type=10"
// 添加自定义参数 custom_params
"...&custom_params=encodeURIComponent(JSON.stringify(custom_params))"