微信小程序预约视频号直播

· 浏览次数 : 7

小编点评

**一、概述** 微信小程序提供一个接口 `reserveChannelsLive`，用于唤起预约视频号直播弹窗。该接口接收一个参数 `noticeId`，通过 `getChannelsLiveNoticeInfo` 接口获取视频号 id 和相关信息。 **二、获取直播预告信息** 通过 `wx.getChannelsLiveNoticeInfo` 接口，根据视频号 id 获取直播预告信息。代码如下： ```js wx.getChannelsLiveNoticeInfo({ finderUserName: 'sphABCDEF123456', success: function (res) { console.log('获取成功：', res); }, fail: function (res) { console.error('获取失败：', res); } }); ``` **三、预约直播** 通过 `wx.reserveChannelsLive` 接口预约直播。代码如下： ```js wx.reserveChannelsLive({ noticeId: noticeId, success: function (reserveRes) { console.log('预约成功：', reserveRes); const reserveState = reserveRes.state; if (reserveState === 6) wx.showToast({ title: '预约成功' }); } }); ``` **四、结果** 在成功预约直播后，返回预约结果，包含以下信息： * `noticeId`：预约视频号 id * `state`：预约状态，例如 1、2、3、4、5、6、7、8、9、10 **五、总结** 通过 `reserveChannelsLive` 接口，可以方便地唤起预约视频号直播弹窗，并获取预约结果。

正文

一、概述

微信小程序提供了可以唤起预约视频号直播弹窗的接口 reserveChannelsLive，该接口接收一个参数 noticeId，通过 getChannelsLiveNoticeInfo 接口获取。因此，过程如下：

查看视频号 id ---finderUserName --> 调用 getChannelsLiveNoticeInfo 接口 ---noticeId --> 调用 reserveChannelsLive 接口 -----> 预约

⭐️ 完整代码实现可以直接看「四、总结」

二、通过「视频号 id 」获取直播预告信息

1、文档

https://developers.weixin.qq.com/miniprogram/dev/api/open-api/channels/wx.getChannelsLiveNoticeInfo.html

2、调用接口

根据文档获取视频号 id（finderUserName），调用 getChannelsLiveNoticeInfo 接口，代码如下：

wx.getChannelsLiveNoticeInfo({
      finderUserName: 'sphABCDEF123456', // 视频号 id(视频号助手获取)
      success: function (res) {
        console.log('获取成功：', res);
      },
      fail: function (res) {
        console.error('获取失败：', res);
      }
    });

3、返回结果

调用接口后，打印结果如下，包含了预约接口需要的 noticeId 以及直播相关的其他信息。

三、通过「预告 id 」预约直播

1、文档

https://developers.weixin.qq.com/miniprogram/dev/api/open-api/channels/wx.reserveChannelsLive.html

2、调用接口

reserveChannelsLive 接口只有一个参数 noticeId，代码如下：

wx.reserveChannelsLive({
          noticeId: noticeId,
          success: function(reserveRes) {
            console.log('预约成功：', reserveRes);
            const reserveState = reserveRes.state;
            if(reserveState === 6) wx.showToast({title: '预约成功'});
          },
        });

3、返回结果

返回结果中包含了 state，state 值对应状态如下：

state=1  正在直播中，用户点击“取消"拒绝前往直播
state=2  正在直播中，用户点击“允许“前往直播
state=3  预告已取消
state=4  直播已结束
state=5  用户此前未预约，在弹窗中未预约直播直接收起弹窗
state=6  用户此前未预约，在弹窗中预约了直播
state=7  用户此前已预约，在弹窗中取消了预约
state=8  用户此前已预约，直接收起弹窗
state=9  弹窗唤起前用户直接取消
state=10 直播预约已过期

四、总结

index.wxml

<view class="invite-btn" bindtap="onBookLive">立即预约</view>

index.js

onBookLive: function () {
    wx.getChannelsLiveNoticeInfo({
      finderUserName: 'sphABCDE1234567', // 视频号 id
      success: function (res) {
        console.log('获取成功：', res);
        const noticeId = res.noticeId;
        wx.reserveChannelsLive({
          noticeId: noticeId,
          success: function (reserveRes) {
            console.log('预约成功：', reserveRes);
            const reserveState = reserveRes.state;
            if (reserveState === 6) wx.showToast({ title: '预约成功' });
          },
        });
      },
      fail: function (res) {
        console.error('获取失败：', res);
      }
    });
  }

END-----------------------------------

浮名浮利，虚苦劳神。

叹隙中驹，石中火，梦中身。