Official Documentation Link Mini Program Live Development Documentation
[Live Components] How to import
Version restrictions: WeChat client version 7.0.7 and above (basic library version 2.9.x and above support same-layer rendering) can watch live broadcasts and use the functions of the live broadcast room. When a lower version just enters the live broadcast room, the user will be prompted to upgrade the WeChat client version (lower versions can only watch live broadcasts, and cannot use the functions of the live broadcast room).
It is supported to introduce [live component] live-player-plugin code package in the main package or sub-package (note: the live component is not included in the code package size), referenced by app.json in the project root directory, the sample code is as follows:
(1) Main package import
"plugins": {
"live-player-plugin": {
"version": "1.3.5",
"provider": "wx2b03c6e691cd7370"
}
},
Among them, wx2b03c6e691cd7370 is the appid of the live broadcast component and cannot be modified, and the version number can be viewed according to the specific usage time
(2) Subcontract introduction
"subpackages": [
{
"plugins": {
"live-player-plugin": {
"version": "1.3.0", // 注意该直播组件最新版本号，微信开发者工具调试时可获取最新版本号（复制时请去掉注释）
"provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid，该示例值即为直播组件appid（复制时请去掉注释）
}
}
}
]
I am using the main package import here
[Live Components] How to use
After importing the component code package configuration according to the method in step 1, you can directly jump to the live component page (that is, enter the live room page) through the link address. The link address needs to bring the live room id; the room id can be obtained through the following Get the room list API.
(1) Use the navigator component to jump into the live broadcast room
index.js
let roomId = [直播房间id] // 填写具体的房间号，可通过下面【获取直播房间列表】 API 获取
let customParams = encodeURIComponent(JSON.stringify({
path: 'pages/index/index', pid: 1 })) // 开发者在直播间页面路径上携带自定义参数（如示例中的path和pid参数），后续可以在分享卡片链接和跳转至商详页时获取，详见【获取自定义参数】、【直播间到商详页面携带参数】章节（上限600个字符，超过部分会被截断）
this.setData({
roomId,
customParams
})
index.wxml
<navigator url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id={
{roomId}}&custom_params={
{customParams}}"></navigator>
// 其中wx2b03c6e691cd7370是直播组件appid不能修改
(2) Use the navigateTo method to jump into the live broadcast room
index.js
let roomId = [直播房间id] // 填写具体的房间号，可通过下面【获取直播房间列表】 API 获取
let customParams = encodeURIComponent(JSON.stringify({
path: 'pages/index/index', pid: 1 })) // 开发者在直播间页面路径上携带自定义参数（如示例中的path和pid参数），后续可以在分享卡片链接和跳转至商详页时获取，详见【获取自定义参数】、【直播间到商详页面携带参数】章节（上限600个字符，超过部分会被截断）
wx.navigateTo({
url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${roomId}&custom_params=${customParams}`
})
// 其中wx2b03c6e691cd7370是直播组件appid不能修改