【小程序】小程序打通视频号 | 微信小店

1,229 阅读9分钟

一、小程序跳转视频号的优点主要包括几个方面

  1. 提升用户粘性:通过小程序和视频号的相互引流,利用小程序定向的推送不同的优惠活动,让消费者看到产品的优惠,既能够通过这些平台与消费者互动,提升用户粘性,还可以提升他们购买产品的欲望。

  2. 流量私有化:小程序和视频号的相互引流使得流量私有化,用户无需担心流量外漏。商家可以通过视频号直播设置优惠券、红包等促销信息,引导用户领取优惠并直接到小程序商城购买产品,从而实现流量的有效沉淀和利用‌。

  3. 实现精准营销:商家可以在视频号直播中设置优惠券、红包等促销信息,用户在领取优惠后可以直接到小程序商城购买产品,这种裂变营销的方式不仅提升了用户的购买欲望,还实现了精准营销的目的‌。

二、小程序 --> 视频号视频

为满足不同开发者的诉求,小程序提供了2种打开视频号视频的方式:

1. 跳转打开视频号视频: API跳转

| 从基础库 [2.19.2] 开始支持

| 无主体限制

| 有跳转弹窗

  • 实现方式

    通过wx.openChannelsActivity接口跳转到指定视频号的视频页观看视频

    提供参数

    属性

    类型

    必填

    说明

    finderUserName

    string

    视频号 id,以“sph”开头的id,可在视频号助手获取

    feedId

    string

    视频 feedId
  • 样式预览

channels-5.2c5921b7.png

2. 内嵌视频号视频:组件channel-video

| 从基础库版本 [2.25.1] 至 [2.31.1],小程序需与视频号视频相同主体或关联主体

| 从基础库版本 [2.31.1] 开始,非个人主体小程序可内嵌非同主体/关联主体视频号视频

| 有主体限制,且不支持个人主体;

| 暂不支持纯图片视频号内容

  • 实现方式

    通过channel-video组件在小程序中内嵌视频号视频,且支持无弹窗跳转打开视频号对应视频

    提供参数

    属性

    类型

    必填

    说明

    feed-id

    string

    仅视频号视频与小程序同主体时生效。 若内嵌非同主体视频,请使用 feed-token。

    finder-user-name

    string

    视频号 id,以“sph”开头的id,可在视频号助手获取。视频号必须与当前小程序相同主体

    feed-token

    string

    仅内嵌小程序非同主体视频号视频时使用。非同主体仅需提供feed-token一个属性即可,无需提供feed-id和finder-user-name。
  • 样式预览

channels-6.813a2891.png

三、小程序 --> 直播间

若小程序与视频号的主体相同或为关联主体,可以跳转到视频号直播间或在小程序内发起视频号直播预约。

1. 跳转前获取视频号的直播信息

开发者可以通过wx.getChannelsLiveInfo接口获取视频号直播id、直播状态、直播主题、视频号头像昵称等直播信息,具体使用方法如下:

| 从基础库 [2.15.0] 开始支持

| 开发者传入视频号id(finderUserName参数),可获取当前或最近一次直播的直播信息,具体如下:

  • status=2,直播中:返回的feedId与nonceId为当前直播id,description为当前直播主题
  • status=3,直播已结束:返回的feedId与nonceId为最近一次直播id,description为最近一次直播主题

| 从基础库 [2.29.0] 开始支持

  • 开发者上传视频号id(finderUserName参数)和起止时间(startTime和endTime参数),获取指定时间段内的全部直播信息。其中正在直播或最近一场的直播信息会直接在出参中返回,其余直播信息会在otherInfos中以列表形式返回。

提供参数

属性

类型

必填

说明

finderUserName

string

视频号 id,以“sph”开头的id,可在视频号助手获取。

startTime

number

起始时间,筛选指定时间段的直播。若上传了endTime,未上传startTime,则startTime默认为0。【最低版本 [2.29.0] 】

endTime

number

结束时间,筛选指定时间段的直播。若上传了startTime,未上传endTime,则endTime默认取当前时间。 【最低版本 [2.29.0]

回调函数参数

属性

类型

说明

feedId

string

直播feedId

nonceId

string

直播 nonceId

description

string

直播主题

status

number

直播状态

headUrl

string

视频号头像

nickname

string

视频号昵称

replayStatus

string

直播回放状态

otherInfos

Array

除最近的一条直播外,其他的直播列表(注意:每次最多返回按时间戳增序排列的15个直播信息,其中时间最近的那个直播会在接口其他的返回参数中展示,其余的直播会在该字段中展示)。

2. 小程序跳转视频号直播间:API跳转

| 从基础库 [2.15.0] 支持

  • 实现方式
    1. 开发者首先通过wx.getChannelsLiveInfo传入视频号id用于获取视频号直播信息,包括直播id(feedId与nonceId两个参数)与直播状态【参考步骤1】。

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

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

Snipaste_2024-11-22_11-42-26.pngSnipaste_2024-11-22_11-43-52.png

3. 小程序内嵌视频号直播:组件channel-live

| 从基础库 [2.29.0] 开始支持

  • 实现方式
    1. 开发者首先通过wx.getChannelsLiveInfo传入视频号id和起止时间(startTime和endTime参数),用于获取指定时间段的视频号直播信息,包括直播id(feedId)、直播状态和直播回放状态【参考步骤1】。

    2. 获取直播信息后,开发者可以通过channel-live在小程序中展示直播封面,用户点击后可无弹窗直接跳转至视频号直播。不同的直播状态,跳转至视频号的承接页页有所不同,具体如下:

    • 直播未开始:上一场直播的结束页
    • 直播中:直播页面
    • 直播已结束(无回放):直播结束页
    • 直播已结束(有回放):直播回放页
  • 样式预览

channel_live_new.3ccc8a4f.png

4. 小程序内发起预约视频号直播

| 从基础库 2.19.0 开始支持

  • 实现方式
    1. 开发者首先通过wx.getChannelsLiveNoticeInfo传入视频号id用于获取视频号直播预告id(noticeId),若当前没有可预约的直播预告,将返回失败。

      提供参数

      属性

      类型

      必填

      说明

      finderUserName

      string

      视频号 id,以“sph”开头的id,可在视频号助手获取

      回调函数参数

      属性

      类型

      说明

      noticeId

      string

      预告 id

      status

      number

      预告状态:0可用 1取消 2已用

      startTime

      string

      开始时间

      headUrl

      string

      直播封面

      nickname

      string

      视频号昵称

      reservable

      boolean

      是否可预约

      otherInfos

      Array

      除最近的一条预告信息外,其他的预告信息列表(注意:每次最多返回按时间戳增序排列的15个预告信息,其中时间最近的那个预告信息会在接口其他的返回参数中展示,其余的预告信息会在该字段中展示)。
    2. 获取直播预告信息后,开发者可以通过wx.reserveChannelsLive唤起预约弹窗,用户可以进行预约操作。成功唤起弹窗即为接口调用成功,通过state可以获取用户具体操作行为:

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

四、小程序 --> 微信小店

1. 小程序内嵌微信小店首页:组件store-home

| 小程序内嵌微信小店首页,展示小店首页,并进行跳转交易

| 基础库 3.5.5 开始支持

  • 提供参数

属性

类型

必填

说明

appid

string

小店appid。获取方式:小店后台 - 店铺管理 - 基础信息 - 账号信息 - 微信小店ID。

2. 小程序内嵌微信小店商品:组件store-product

| 小程序内嵌微信小店商品,展示小店商品,并进行跳转交易。支持小店优选联盟带货跟佣功能。

| 基础库 3.5.5 开始支持

  • 提供参数

属性

类型

必填

说明

appid

string

小店appid。获取方式:小店后台 - 店铺管理 - 基础信息 - 账号信息 - 微信小店ID。

product-id

string

商品id。获取小店商品id,可以通过API获取(参考链接)或通过小店后台 - 商品管理 - 商品列表 - 规格/编码获取。

product-promotion-link

string

带货商品跟佣信息。若需要商品售卖时使用小店优选联盟带货跟佣功能,可以通过API获取带货商品跟佣信息(参考链接)。

五、如何判断主体?

1. 主体信息查询

小程序主体信息可通过小程序资料页-开发团队进行查询,视频号主体信息可通过视频号首页-认证进行查询。

channels-1.9db3bb0f.png

2. 关联主体

关联主体,也称关联企业,指与开发者具有关联关系的法人或组织。开发者可以将与开放平台账号主体具有关联关系的主体申请绑定为关联主体。

可在微信公众平台——账号设置——关联设置中查看关联主主体信息。