一、背景

在7月份，微信小程序上线了跳转视频号直播的功能，我们也在第一时间发布了直播悬浮窗组件，使商家能够更便捷的将用户导流至视频号直播，促进成交。在近期，微信又上线了小程序预约直播功能，更加丰富了小程序与视频号之间的互动，我们也在微页面中新增了相关组件，帮助商家接入该功能。

二、实际效果

1、视频号直播悬浮窗

点击可跳转视频号直播间。该组件无需配置，商家直播时便会在页面上展示。

2、视频号直播组件

需要商家在后台微页面配置，只要商家在视频号直播中创建预告，即可出现预约状态，支持用户点击预约

点击预约后

预约之后，在直播开始时，将会有消息推送提醒用户进直播间：

若直播已开始，则会展示直播中的状态，点击跳转直播间

三、对接微信接口

1、小程序跳转视频号直播间

开发者首先通过wx.getChannelsLiveInfo传入视频号id用于获取视频号直播信息，包括直播id（feedId与nonceId两个参数）与直播状态。其中直播状态含义如下：

• status=2：直播中，此时返回的feedId与nonceId为当前直播id
• status=3：直播已结束，此时返回的feedId与nonceId为最近一次直播id

获取直播信息后，开发者可以通过wx.openChannelsLive打开视频号直播。若当前未在直播，则会跳转到最近一场直播的结束页。该接口使用限制如下：

•  需要用户触发跳转，若用户未点击小程序页面任意位置，则开发者将无法调用此接口。
• 需要用户确认跳转，在跳转至视频号直播前，将统一增加弹窗，询问是否跳转，用户确认后才可以跳转视频号直播。

在调试wx.getChannelsLiveInfo接口时比较麻烦的是需要在真机上测试，在开发者工具上，接口无法正常获取信息，会报告如下错误：

{"errMsg":"getChannelsLiveInfo:fail","err_code":"-14"}

当然在真机上也得注意获取的是同一主体的视频号直播信息，否则会报告如下错误：

{"errMsg":"getChannelsLiveInfo:fail data unknow error code","err_code":"100008"}

成功获取到视频号直播信息后，就可以调用wx.openChannelsLive进行直播间跳转，可能是为了防止开发者滥用此功能，微信要求必须用户点击小程序页面任意位置才能触发此接口，这句话说的有点模糊，到底是说用户点击后，就可以在任意时间调用此接口，还是每次调用都需要用户点击。在实际测试了之后发现，每次调用都需要用户点击，也就是需要在点击回调事件中调用，并且这里还有一点要注意，不能将调用写在promise或者setTimeout中，如：

setTimeout(() => {
  wx.openChannelsLive()
}, 0);

Promise.resolve().then(() => {
  wx.openChannelsLive();
});

这样也会导致接口调用失败。

四、小程序内发起预约视频号直播

预约也是分两步走

1. 开发者首先通过wx.getChannelsLiveNoticeInfo传入视频号id用于获取视频号直播预告id（noticeId），若当前没有可预约的直播预告，将返回失败。
2. 获取直播预告信息后，开发者可以通过wx.reserveChannelsLive唤起预约弹窗，用户可以进行预约操作。成功唤起弹窗即为接口调用成功，通过state可以获取用户具体操作行为。

获取预告信息会给到如下信息：

其中noticeId是用于后续预约预告用的，没什么可说的，比较让人疑惑的是status和reservable字段，你可能会将status理解成目前的预告状态，reservable理解成用户是否已预约，没毛病，笔者刚开始也是那么理解的，但真实调用后发现status只会存在0这种状态，如果预告被取消了或者已用，那直接就走到fail回调里面了。而reservable也不是是否已预约的意思，不管用户是否预约，该字段都是返回true。

所以，status和reservable字段目前给不到更多有价值的信息（后期可能会调整），若你想得知用户是否已预约，只能自己写接口去记录了。

获取直播预告信息后，开发者可以通过wx.reserveChannelsLive唤起预约弹窗，不同于跳转直播间，预约弹窗可随时唤起，不需要用户有点击操作，且支持在异步回调中调用。

预约弹窗唤起后，根据用户的行为，会在success回调中返回相应的state值：

这里特别要说明的是，如果是正在直播中的状态，wx.reserveChannelsLive不再会唤起预约弹窗，而是直接唤起跳转直播弹窗，与wx.openChannelsLive的效果类似：

关于视频号预告，还有一点冷知识，当实际时间到达预告时间时，预告不会立即消失，而是会再保持一个小时，若一个小时后还未开始直播，预告才会被移除，并且在移除之前，预约相关的接口都可以正常调用。

五、总结

本文主要介绍了小程序对于视频号直播预约、跳转的支持，以及实际对接过程中遇到的一些问题，若想了解如何在视频号直播卖货可移步至https://help.youzan.com/displaylist/detail_4_4-2-54639

六、一些期待

1. 目前视频号直播的功能都必须在同一主体下才能使用，希望微信能够早日放开这一限制。
2. 给到用户与开发者的直播数据过少，希望微信能够开放更多的直播数据，帮助用户分析直播效果，提升直播质量。