라이브 방송 컴포넌트를 통해 미니프로그램의 라이브 방송 기능 구현

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를 통해 얻을 수 있습니다. 샘플 코드는 다음과 같습니다.

 Go to Live Player page

로그인 후 복사

이 링크를 통해 생방송 구성 요소 페이지로 이동할 수 있습니다( 현재 페이지 입구는 'live-player-plugin'에만 열려 있습니다.)

예제 렌더링은 다음과 같습니다.

3. 기타 관련 구성 요소, 인터페이스 및 전달 매개변수

● 구독 구성 요소: subscribe

● 라이브 방송 상태 가져오기 API: getLiveStatus

● 라이브 방송에서 전달 room에서 업체 상세페이지로 이동 매개변수: room_id

● 그룹 공유 카드에서 생방송 방으로 돌아올 때 전달되는 매개변수: shareTicket

● 생방송 방 목록 API를 얻기 위한 배경

● 재생 소스 비디오 API를 얻기 위한 배경

참고: 위 2가지 백그라운드 통화 인터페이스의 총 상한은 하루 500회입니다.

1. 【구독】구성요소

기능 설명:

사용자는 라이브 방송 방에 입장하여 라이브를 단일 구독할 수 있습니다. 방송이 시작되면 라이브 방송 구성 요소가 자동으로 사용자에게 시작 알림을 보냅니다. 개발자에게는 추가 개발이 필요하지 않습니다.

구성 요소 사용:

동일한 방송 알림 기능이 필요한 경우 생방송 구성 요소 페이지가 아닌 미니 프로그램의 다른 페이지에서는 [구독] 구성 요소를 소개할 수 있습니다. 구독은 페이지의 홈 페이지(예: 홈 페이지)에 있어야 합니다. json은 구독 구성 요소를 참조합니다. 샘플 코드는 다음과 같습니다.

{ "usingComponents": { "subscribe": "plugin-private://wx2b03c6e691cd7370/components/subscribe/subscribe" } }

로그인 후 복사

그런 다음 home.wxml의 구독 구성 요소를 사용할 수 있습니다. 여기서 라이브 방 ID는 아래의 [라이브 방 목록 가져오기] API를 통해 얻을 수 있습니다.

로그인 후 복사

2. [라이브 방송 상태 가져오기] 인터페이스

인터페이스 설명:

첫 번째 획득 후 즉시 라이브 방송 상태로 돌아가고 1분 이하마다 라이브 방송 상태를 가져오기 위해 폴링합니다.

라이브 방송 상태 설명:

l 101 라이브 방송: 앵커가 정상적으로 방송을 시작했으며 라이브 방송이 정상적인 상태임을 나타냅니다.

l 102 시작되지 않음: 앵커가 아직 방송을 시작하지 않았음을 나타냅니다. 생방송 종료 시 [종료] 버튼을 눌러 생방송이 정상적으로 종료되었거나, 생방송이 비정상적으로 종료된 지 15분 후 시스템에 의해 생방송이 강제 종료되었습니다. 위반으로 인한 운영 처벌로 인해 금지됨

l 105 Paused: MP 애플릿 배경 콘솔에서 작동하여 라이브 방송이 일시 중지되었음을 나타냅니다.

l 106 예외: 앵커가 떠나면 배경으로 전환됨을 나타냅니다. 또는 인터넷 연결이 끊긴 경우, 생방송이 비정상적인 상태로 판단되어 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. [라이브 방 목록 가져오기] 인터페이스는 백그라운드 통화에만 사용됩니다.

该接口仅供商家后台调用，调用限额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" } // 一场直播可能会产生多个视频片段。

로그인 후 복사