生放送コンポーネントによるミニ番組の生放送機能を実装

1. はじめに

WeChat はミニ プログラム開発者向けにライブ ブロードキャスト コンポーネントを提供しており、このコンポーネントを呼び出すことで、販売者はミニ プログラムにライブ ブロードキャスト機能を実装できます。

(学習ビデオ共有: プログラミングビデオ)

ミニプログラムに生放送コンポーネントを導入する方法を紹介します。

2. 使用方法

1. [ライブ ブロードキャスト コンポーネント] 導入方法

バージョン制限:

WeChat クライアント バージョン 7.0.7 以降(基本ライブラリ バージョン 2.9.x 以降は同一レイヤー レンダリングをサポートしています) ライブ ブロードキャストを視聴し、ライブ ブロードキャスト ルームの機能を使用できます。下位バージョンでは、ユーザーが最初にライブ ブロードキャスト ルームに入室するときに WeChat クライアントのバージョンをアップグレードするように求められます (下位バージョン)ライブ配信の視聴のみ可能であり、ライブ配信ルーム機能は利用できません）。

[ライブ ストリーミング コンポーネント] live-player-plugin コード パッケージをサブパッケージに導入し、プロジェクトのルート ディレクトリにある app.json を参照します。サンプル コードは次のとおりです:

{

  "subpackages": [

    {

      "root": "packageA",

      "pages": [

        "pages/home/home"

      ],

      "plugins": {

        "live-player-plugin": {         

"version": "1.0.0", // 填写该直播组件最新版本号，微信开发者工具调试时可获取最新版本号

          "provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid，该示例值即为直播组件appid

        }

      }

    }

  ]

}

2. [ライブ ストリーミング コンポーネント] 手順 手順 1 の方法に従って

を使用してコンポーネント コード パッケージ構成を導入した後、リンク アドレス (つまり、ライブ ブロードキャスト ルーム ページにアクセスします)。リンク アドレスにはライブ ブロードキャスト ルーム ID が必要です。ルーム ID は、以下の [ライブ ブロードキャスト ルーム リストの取得] API を通じて取得できます。サンプル コードは次のとおりです:

<navigator url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]">

  Go to Live Player page

</navigator>

このリンクからライブ ブロードキャスト コンポーネント ページにジャンプできます (現在のページの入り口は「live-player-plugin」にのみ開かれています)。

サンプル レンダリングは次のとおりです:

3. その他の関連コンポーネント、インターフェイス、およびパラメータを運ぶ

● サブスクリプション コンポーネント:subscribe

##● ライブ ブロードキャスト ステータスの取得 API: getLiveStatus

##● ライブ ブロードキャスト ルームからビジネス詳細ページに伝達されるパラメータ: room_id

● ライブ ブロードキャスト ルームからビジネス詳細ページに伝達されるパラメータ: room_id

●グループ共有カードからライブ ブロードキャスト ルームに戻る : Shareticket

● バックグラウンド API でライブ ブロードキャスト ルーム リストを取得します

● バックグラウンドでソース ビデオ API を取得します

注: 上記 2 つのバックグラウンド呼び出しのインターフェースの合計上限は 500 回/日

1. 【サブスクリプション】コンポーネント

機能説明:

ユーザー入力ライブ ブロードキャスト ルームにアクセスし、まだ開始されていないライブ ブロードキャストに 1 回のサブスクリプションを作成できます。ブロードキャストが開始されると、ライブ ブロードキャスト コンポーネントは、開発者が追加の

# を開発することなく、ブロードキャスト開始リマインダーをユーザーに自動的に配信します。 ## コンポーネントの使用法:

ライブ ブロードキャスト コンポーネント ページ以外のミニ プログラムの他のページでも同じブロードキャスト開始リマインダー機能が必要な場合は、[ Subscription] コンポーネント submit を導入できます。ページ ページ (ホームページなど) の home.json 内のサブスクリプション コンポーネントサンプル コードは次のとおりです:

{

  "usingComponents": {

    "subscribe": "plugin-private://wx2b03c6e691cd7370/components/subscribe/subscribe"

  }

}

これで、home.wxml 内のサブスクリプション コンポーネントを使用できます。 id を渡すことができます。ルーム ID は、[ライブ ブロードキャスト ルーム リストの取得] API

<subscribe room-id="[直播房间id]"></subscribe>

2 を通じて取得できます。[ライブ ブロードキャスト ステータスの取得] インターフェイス

インターフェイスの説明:

初めて取得してすぐにライブ ブロードキャストに戻りますステータス、ライブ ブロードキャスト ステータスを取得するために 1 分以下の間隔でポーリングが実行されます;

ライブ ブロードキャスト ステータスの説明:

l 101 ライブ ブロードキャスト: アンカーが正常にブロードキャストを開始しており、ライブ ブロードキャストが通常の状態にあることを示します;

l 102 未開始: ホストがブロードキャストを開始していないことを示します;

l 103 終了: ライブ ブロードキャスト終了の [終了] ボタンをクリックすることでライブ ブロードキャストが正常に終了するか、システムが 15 分後に強制的にライブ ブロードキャストを異常終了させることを示します。 ##l 104 禁止: 違反による操作ペナルティによりブロードキャストが禁止されていることを示します;

l 105 一時停止: MP アプレットのバックグラウンド コンソールでの操作によってライブ ブロードキャストが一時停止されていることを示します ;

l 106 異常：アンカーの離脱、バックグラウンドへの切り替え、インターネット接続の切断などを示します。ライブ配信は異常な状態と判断され、再開後は通常のライブ配信状態に戻ることができます。 15 分以内; ライブ ブロードキャストが 15 分後も継続する場合、復元されない場合、ライブ ブロードキャスト ルームはシステムによって強制的にライブ ブロードキャストを終了します;

l 107 期限切れ: ライブ ブロードキャストが終了したことを意味しますブロードキャスト ルームがブロードキャストを開始しておらず、MP アプレット バックグラウンドでライブ ブロードキャスト ルームを作成するときに入力されたライブブロードキャスト プランの終了時刻に達した場合、ライブブロードキャストは期限切れと判断され、再度ブロードキャストすることはできません。

呼び出しメソッド:

[ライブ ブロードキャスト ステータスの取得] インターフェイス getLiveStatus を呼び出すには、ミニ プログラム ページの上部にある [ライブ ストリーミング コンポーネント] ライブ プレーヤー - プラグイン、サンプル コードを引用する必要があります。

let livePlayer = requirePlugin('live-player-plugin') //ライブブロードキャストステータスを取得するインターフェースを紹介します

//初回取得時は、すぐにライブ ブロードキャスト ステータスに戻り、その後 1 分以内の間隔でポーリングしてライブ ブロードキャスト ステータスを取得します。

const roomId = xxx

// 房间id

livePlayer.getLiveStatus({ room_id: roomId })

  .then(res => {

    //

101: 直播中, 102: 未开始, 103: 已结束,

104: 禁播, 105: 暂停中, 106: 异常，107：已过期

    const

liveStatus = res.liveStatus

  })

  .catch(err =>

{

    console.log(err)

  })

3. パラメータを運ぶ

バージョン制限:

ライブ ブロードキャスト コンポーネント バージョン 1.0.1 以降では、次のパラメータの保持がサポートされています。

shareTicket: ライブ ブロードキャスト ルーム カードを WeChat グループに共有します。このカードをクリックすると、 ApponShow のパラメータ

• room_id: クリック ライブ ブロードキャスト コンポーネント ページの棚製品がマーチャント アプレットの製品詳細ページにジャンプすると、部屋番号パラメータ

  # が表示されます。
• ##4. [ライブ ブロードキャスト ルーム リストの取得] インターフェイスはバックエンド専用です Call
  インターフェイス ルール:

该接口仅供商家后台调用，调用限额500次/天，建议开发者自己做缓存（此接口与下面【获取回放视频】接口共用500次/天限制，请合理分配调用频次）。

请求URL：

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

请求方式：

POST

请求示例：

Request

{

 "start": 0, // 起始拉取房间，start=0表示从第1个房间开始拉取

 "limit": 10 // 每次拉取的个数上限，不要设置过大，建议100以内

}



Response

{

 "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_satus": 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

}

返回字段：

• name 房间名

• roomid 房间id

注：需先在小程序MP后台创建直播房间，否则会报错（错误码1）

• cover_img 封面图片url

• start_time 直播计划开始时间，列表按照 start_time 降序排列

• end_time 直播计划结束时间

• anchor_name 主播名

• goods 商品列表

• live_status 直播状态   101: 直播中, 102: 未开始, 103: 已结束, 104: 禁播, 105: 暂停中, 106: 异常,107:已过期（直播状态解释可参考【获取直播状态】接口）

5.   【获取回放源视频】接口，仅供后台调用

接口规则：

该接口仅供商家后台调用，调用限额500次/天，此接口与上面【获取房间列表】接口共用500次/天限制，请合理分配调用频次）。

 

接口说明：

• 该接口可在直播结束后拿到回放源视频（直播结束后大约10分钟会生成回放，源视频无评论等内容）

• 拿到源视频后需要开发者自行开发、使用回放视频

• 如果把源视频直接放在小程序上使用，需要小程序具备视频资质（具体资质要求请参考《小程序开发的类目服务》）

后续官方会直接提供无需开发的直播回放功能，敬请期待。

请求URL：

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

请求方式：

POST

请求示例：

Request

{

"action": "get_replay", // 获取回放

"room_id": 354, // 直播间id

"start": 0, // 起始拉取视频，start=0表示从第1个视频片段开始拉取

"limit": 10 // 每次拉取的个数上限，不要设置过大，建议100以内

}



Response

{

"live_replay": [  

{

      "expire_time": "2020-11-11T03:49:55Z", // 回放视频url过期时间

      "create_time": "2019-11-12T03:49:55Z", // 回放视频创建时间

      "media_url": "http://xxxxx.vod2.myqcloud.com/xxxxx/xxxxx/f0.mp4" // 回放视频   

} 

], 

"errcode": 0, 

"total": 1, 

"errmsg": "ok"

} // 一场直播可能会产生多个视频片段。

四、其他说明

1、直播间小程序码

说明：

• 小程序引入直播组件后必须进行一次小程序发布上线，否则小程序码不生效

• 在MP小程序直播后台创建好直播间后，可以直接拿到直播间分享小程序码，无需额外开发

如果商家在后台自己生成的直播间小程序码，需要做以下配置（否则直播间左上角返回键将失效）：

在跳转进入直播间的路径加上 type=9 标识场景入口为小程序码：

"plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]&type=9"

2、商家公众号文章添加小程序卡片

说明：

商家在公众号文章中添加跳转进入直播间的小程序卡片时，需要做以下配置（否则直播间左上角返回键将失效）：

在跳转进入直播间的路径加上 type=10 标识场景入口为小程序卡片：

"plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=[直播房间id]&type=10"

3、商品详情页面需添加返回按钮

点击直播组件页面里的货架商品跳转到商家小程序的商品详情页面后，为了避免用户无法再返回直播间，商家需在小程序商品详情页面左上角加上返回按钮，用于返回到直播组件页面。

4、快速更新直播组件版本的方法

商家小程序对应的管理员微信号收到【公众平台安全助手】下发的直播组件版本更新的服务通知后，可点击通知进行快速发布，移动端即可快速更新小程序内直播组件的新版本，无需修改代码或重新提交审核。

服务通知如下图所示：

相关推荐：小程序开发教程

以上が生放送コンポーネントによるミニ番組の生放送機能を実装の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。