微信小程式預約影片號直播

麦豇豆發表於2024-05-28
微信小程式

一、概述

微信小程式提供了可以喚起預約影片號直播彈窗的介面 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 直播預約已過期

四、總結

1、完整程式碼

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);
      }
    });
  }

2、其他

我遇到的一個小問題：小程式在調起預約直播彈窗的時候會觸發頁面 onHide，如果頁面有音訊，會導致音訊播放停止，注意需要在 onShow 的時候再次播放。

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

浮名浮利，虛苦勞神。
嘆隙中駒，石中火，夢中身。

相關文章