微信小程序现在可以开通直播功能,只要符合资质的都可以开通直播。开通该功能后,我们只需要按照文档里面说明的方式开发就好了。
首先我们引入【直播组件】 live-player-plugin
分为两种方式引入,一种是在主包中引入,另一种是在分包中引入。因为直播组件不计入代码包体积,所以小编建议大家在主包引入,而且还有些功能只能在主包中使用,这个也是看大家的需求。
引入方式,在app.json里面引入,json文件里面不能写注释,大家在引入的时候记得把注释删除掉:

  • 主包引入

    "plugins": {
          "live-player-plugin": {
              "version": "1.0.5", // 注意填写该直播组件最新版本号,微信开发者工具调试时可获取最新版本号(复制时请去掉注释)小编在开发的时候版本是1.0.5
              "provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid,该示例值即为直播组件appid(复制时请去掉注释)
          }
      }
  • 分包引入

    "subpackages": [
          {
              "plugins": {
                  "live-player-plugin": {
                      "version": "1.0.5", // 注意该直播组件最新版本号,微信开发者工具调试时可获取最新版本号(复制时请去掉注释)
                      "provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid,该示例值即为直播组件appid(复制时请去掉注释)
                  }
              }
          }
      ]

接下来我们就要进入直播间了,不需要我们写直播的界面,只需要跳转到直播组件就可以了。分享官方也给封装好了,只需要拿来使用就可以了,跳转方式也有两种,房间号在你创建完直播间的时候就有了。

  • 直接通过navigator进行跳转

    let roomId = [直播房间id] // 房间号
      let customParams = { path: 'pages/index/index', pid: 1 } // 开发者在直播间页面路径上携带自定义参数(如示例中的path和pid参数),后续可以在分享卡片链接和跳转至商详页时获取,详见【获取自定义参数】、【直播间到商详页面携带参数】章节
      this.setData({
          roomId,
          customParams: encodeURIComponent(JSON.stringify(customParams))
      })
      <navigator url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id={{roomId}}&custom_params={{customParams}}"></navigator>
      // 其中wx2b03c6e691cd7370是直播组件appid不能修改
  • js中跳转

    let roomId = [直播房间id] // 房间号
      let customParams = { path: 'pages/index/index', pid: 1 } // 开发者在直播间页面路径上携带自定义参数(如示例中的path和pid参数),后续可以在分享卡片链接和跳转至商详页时获取,详见【获取自定义参数】、【直播间到商详页面携带参数】章节
      wx.navigateTo({
          url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${roomId}&custom_params=${encodeURIComponent(JSON.stringify(customParams))}`
      })
      // 其中wx2b03c6e691cd7370是直播组件appid不能修改

另外在说一下获取直播间列表的方法、

【获取直播房间列表】接口,仅供后台调用
接口规则:该接口仅供商家后台调用,调用限额 500 次/天,建议开发者自己做缓存(此接口与下面【获取回放视频】接口共用 500 次/天限制,请合理分配调用频次)。

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

请求方式: POST

请求示例:

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

Response(官方文档可能有问题,anchor_img这个没返回,返回的是share_img)

    {
        "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_status": 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"
            }
        ],
        "total": 1
    }

常用的就这些了,要是有需要小编说明的,欢迎在下方留言。
微信小程序开通直播功能.jpeg

Last modification:April 11, 2020
If you think my article is useful to you, please feel free to appreciate