小程序直播组件接入指引

一、简介

小程序直播，是微信提供给小程序开发者的直播组件。通过调用该组件，商家能够在小程序中实现直播性能。

按上面的应用阐明接入，在你的小程序中引入直播组件。

二、应用办法阐明

1.【直播组件】如何引入

版本限度：微信客户端版本 7.0.7 及以上（根底库版本 2.9.x 及以上反对同层渲染）能够观看直播及应用直播间的性能，低版本刚进入直播间时会提醒用户降级微信客户端版本（低版本只能观看直播，无奈应用直播间的性能）。

在分包内引入【直播组件】live-player-plugin 代码包，我的项目根目录的 app.json 援用，示例代码如下：

{   "subpackages": [     {       "root": "packageA",       "pages": [         "pages/home/home"       ],       "plugins": {         "live-player-plugin": {           "version": "1.0.0", // 填写该直播组件最新版本号，微信开发者工具调试时可获取最新版本号           "provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid，该示例值即为直播组件appid         }       }     }   ] }

2.【直播组件】如何应用

按第1步的办法把组件代码包配置引入后，即可间接通过 链接地址跳转到直播组件页面（即为进直播间页面） 链接地址须要带上直播房间id；房间id可通过上面 【获取直播房间列表】

API获取，示例代码如下：

Go to Live Player page

通过该链接可跳转到直播组件页面（以后页面入口仅凋谢‘live-player-plugin’）。

示例效果图如下：

三、其余相干组件、接口和携带参数

  • 订阅组件：subscribe
  • 获取直播状态API：getLiveStatus
  • 直播间到商详页面携带参数：room_id
  • 从群分享卡片返回直播间时携带参数：shareTicket
  • 后盾获取直播房间列表API
  • 后盾获取回放源视频API
    注：以上2个后盾调用的接口总下限500次/天

1.【订阅】组件

性能解释：用户进入直播间内，可对一场未开播的直播进行单次订阅，开播时直播组件会主动下发开播揭示给用户， 无需开发者额定开发

组件应用：如果须要 在直播组件页以外小程序其余页面也有同样的开播揭示的性能，能够引入【订阅】组件subscribe；需在page页面（如home页面）的 home.json 援用订阅组件，示例代码如下：

{   "usingComponents": {     "subscribe": "plugin-private://wx2b03c6e691cd7370/components/subscribe/subscribe"   } }

而后便可在home.wxml里应用订阅组件，其中直播房间id可通过；房间id可通过上面【获取直播房间列表】API获取

2. 获取直播状态接口

接口阐明：首次获取立马返回直播状态，往后距离1分钟或更慢的频率去轮询获取直播状态

直播状态阐明：

  • 101直播中：示意主播失常开播，直播失常的状态
  • 102未开始：示意主播还未开播
  • 103已完结：示意在直播端点击【完结】按钮失常敞开的直播，或直播异样15分钟后零碎强制完结的直播
  • 104禁播：示意因违规受到经营处罚被禁播
  • 105暂停中：示意在MP小程序后盾-控制台内操作暂停了直播
  • 106异样：示意主播来到、切后盾、断网等状况，该直播被断定为异样状态，15分钟内复原即可回到失常直播中的状态；如果15分钟后还未复原，直播间会被零碎强制完结直播
  • 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) })

3. 携带参数

版本限度：直播组件版本1.0.1及以上反对携带以下参数

1) shareTicket：分享直播间卡片到微信群，点击此卡片后能够在 App onShow 里获取该参数

2) room_id：点击直播组件页面里的货架商品跳转到商家小程序的商品详情页面时，会带上房间号参数

4.【获取直播房间列表】接口，仅供后盾调用

接口规定：该接口仅供商家后盾调用，调用限额500次/天，倡议开发者本人做缓存（此接口与上面 【获取回放视频】接口共用500次/天限度，请正当调配调用频次）。

申请URL：http://api.weixin.qq.com/wxa/business/getliveinfo?access_token=

申请形式：POST

申请示例：

Request

{  "start": 0, // 起始拉取房间，start=0示意从第1个房间开始拉取  "limit": 10 // 每次拉取的个数下限，不要设置过大，倡议100以内 }

Response

{  "errcode": 0, // errcode=0代表胜利；errcode=1代表未创立直播房间  "errmsg": "ok",  "room_info": [{   "name": "直播房间名",   "roomid": 1,   "cover_img": "http:\/\/mmbiz.qpic.cn\/mmbiz_jpg\/Rl1RuuhdstSfZa8EEljedAYcbtX3Ejpdl2et1tPAQ37bdicnxoVialDLCKKDcPBy8Iic0kCiaiaalXg3EbpNKoicrweQ\/0?wx_fmt=jpeg",   "live_satus": 101,    "start_time": 1568128900,   "end_time": 1568131200,   "anchor_name": "李四",   "anchor_img": "http:\/\/mmbiz.qpic.cn\/mmbiz_jpg\/Rl1RuuhdstSfZa8EEljedAYcbtX3Ejpdlp0sf9YTorOzUbGF9Eib6ic54k9fX0xreAIt35HCeiakO04yCwymoKTjw\/0?wx_fmt=jpeg",   "goods":[               {       "cover_img":"http://mmbiz.qpic.cn/mmbiz_png/FVribAGdErI2PmyST9ZM0JLbNM48I7TH2FlrwYOlnYqGaej8qKubG1EvK0QIkkwqvicrYTzVtjKmSZSeY5ianc3mw/0?wx_fmt=png",       "url":"pages/index/index.html",       "price":1100,       "name":"fdgfgf"     }    ]  }

返回字段：

  • name 房间名
  • roomid 房间id
    注：需先在小程序MP后盾创立直播房间，否则会报错（错误码1）
  • cover_img 封面图片url
  • start_time 直播打算开始工夫，列表依照 start_time 降序排列
  • end_time 直播打算完结工夫
  • anchor_name 主播名
  • goods 商品列表
  • live_status 直播状态   101: 直播中, 102: 未开始, 103: 已完结, 104: 禁播, 105: 暂停中, 106: 异样，107:已过期（直播状态解释可参考【获取直播状态】接口）

5.【获取回放源视频】接口，仅供后盾调用

接口规定：该接口仅供商家后盾调用， 调用限额500次/天，此接口与下面 【获取房间列表】接口 共用500次/天限度，请正当调配调用频次）。

接口阐明：

  • 该接口可在直播完结后拿到回放源视频（直播完结后大概10分钟会生成回放，源视频无评论等内容）
  • 拿到源视频后须要开发者自行开发、应用回放视频
  • 如果把源视频间接放在小程序上应用，须要小程序具备视频资质（具体资质要求请参考《小程序开发的类目服务》）

后续官网会间接提供无需开发的直播回放性能，敬请期待。

申请URL：http://api.weixin.qq.com/wxa/business/getliveinfo?access_token=

申请形式：POST

申请示例：

Request

{   "action": "get_replay", // 获取回放   "room_id": 354, // 直播间id   "start": 0, // 起始拉取视频，start=0示意从第1个视频片段开始拉取   "limit": 10 // 每次拉取的个数下限，不要设置过大，倡议100以内 }

Response

{   "live_replay": [     {       "expire_time": "2020-11-11T03:49:55Z", // 回放视频 url 过期工夫       "create_time": "2019-11-12T03:49:55Z", // 回放工夫创立工夫       "media_url": "http://xxxxx.vod2.myqcloud.com/xxxxx/xxxxx/f0.mp4" // 回放视频     }   ],   "errcode": 0,   "total": 1,   "errmsg": "ok" } // 一场直播可能会产生多个视频片段。

四、其余阐明

1、直播间小程序码

阐明：

  • 小程序引入直播组件后必须进行一次小程序公布上线，否则小程序码不失效
  • 在MP小程序直播后盾创立好直播间后，能够间接拿到直播间分享小程序码，无需额定开发

在跳转进入直播间的门路加上 type=9 标识场景入口为小程序码：

plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]&type=9

2、商家公众号文章增加小程序卡片

阐明：商家在公众号文章中增加跳转进入直播间的小程序卡片时，须要做以下配置（否则直播间左上角返回键将生效）：

在跳转进入直播间的门路加上 type=10 标识场景入口为小程序卡片：

plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]&type=10

3、商品详情页面需增加返回按钮

点击直播组件页面里的货架商品跳转到商家小程序的商品详情页面后， 为了防止用户无奈再返回直播间，商家需在小程序商品详情页面左上角加上返回按钮，用于返回到直播组件页面。

4、疾速更新直播组件版本的办法

商家小程序对应的管理员微信号 收到【公众平台平安助手】下发的直播组件版本更新的服务告诉后，可点击告诉进行疾速公布，挪动端即可疾速更新小程序内直播组件的新版本，无需批改代码或从新提交审核。

开源案例

以网上看到的来客推的为案例

批改小程序端代码，在app.json外面新增如下代码：

在“sitemapLocation”: “sitemap.json” 这一段的前面加一个逗号 “，” 再加上面这段代码：

"plugins": {

"live-player-plugin": {

"version": "1.0.4",

"provider": "wx2b03c6e691cd7370"

}

}

5、在来客零碎后盾，“插件列表”-》“直播间”

第一步：

第二步：批改直播房间ID，如何获取房间ID？往下看

获取房间ID，进入微信后盾 mp.weixin.qq.com ,创立一个直播间