You need to enable JavaScript to run this app.
导航
接入指引
最近更新时间:2024.03.06 19:52:42首次发布时间:2024.03.06 19:52:42

本文为您介绍微信小程序如何接入视频直播拉流 SDK。

前提条件

  • 已在视频直播控制台完成域名添加,并配置 CNAME
  • 已生成直播流的拉流地址,如果您需要使用 HTTPS 类型拉流地址,请先添加证书,并开启 HTTPS 配置
  • 创建工单联系技术支持获取视频直播侧微信小程序应用的 AppID。
  • 已注册小程序,并已通过 live-player 媒体组件要求的类目审核
  • 已在微信小程序后台 > 开发 > 开发管理 > 开发设置 > 域名服务器模块的 request 合法域名中添加了日志上报域名(https://mcs.zijieapi.com)和其他请求域名如拉流域名、封面图资源域名等。

安装 SDK

  1. 在小程序 package.json 所在的目录中执行以下命令安装 npm 包。

    npm i veplayer-live-mp-wx
    
  2. 在微信开发者工具的菜单栏选择工具 > 构建 npm,构建完成后即可使用 npm 包。

引入组件

在小程序项目的 index.json 中引入 npm 包中的组件。

// index.json
{
  "usingComponents": {
    "ve-live-player": "veplayer-live-mp-wx/ve-live-player/ve-live-player"
  }
}

使用组件

在 index.wxml 文件中使用组件及其功能,以配置拉流地址进行自动播放为例,示例代码如下。

<!-- index.wxml -->
<ve-live-player autoplay src="{{src}}" />

接入其他功能

视频直播微信小程序组件(ve-live-player)支持封面图设置、事件监听、报错监听、自适应容器、日志上报等功能,接入方法请参考功能接入文档。