LivePlayer - 《Taro 文档帮助手册教程》

title: LivePlayer

sidebar_label: LivePlayer

实时音视频播放。相关api：Taro.createLivePlayerContext

需要先通过类目审核，再在小程序管理后台，“设置”-“接口设置”中自助开通该组件权限。

参考文档

ComponentType<LivePlayerProps>

class App extends Components {
  render () {
    return (
      <LivePlayer src='url' mode='live' autoplay  />
    )
  }
}

参数	类型	默认值	必填	说明
src	`string`		否	音视频地址。目前仅支持 flv, rtmp 格式
mode	`"live" \| "RTC"`	`"live"`	否	模式
autoplay	`boolean`	`false`	否	自动播放
muted	`boolean`	`false`	否	是否静音
orientation	`"vertical" \| "horizontal"`	`"vertical"`	否	画面方向
objectFit	`"contain" \| "fillCrop"`	`"contain"`	否	填充模式
backgroundMute	`boolean`	`false`	否	进入后台时是否静音（已废弃，默认退台静音）不推荐使用
minCache	`number`	`1`	否	进最小缓冲区，单位s
maxCache	`number`	`3`	否	进最小缓冲区，单位s
soundMode	`"speaker" \| "ear"`	`"speaker"`	否	声音输出方式
autoPauseIfNavigate	`boolean`	`true`	否	当跳转到本小程序的其他页面时，是否自动暂停本页面的实时音视频播放
autoPauseIfOpenNavigate	`boolean`	`true`	否	当跳转到其它微信原生页面时，是否自动暂停本页面的实时音视频播放
onStateChange	`BaseEventOrigFunction<onStateChangeEventDetail>`		否	播放状态变化事件，detail = {`{code}`}
onFullScreenChange	`BaseEventOrigFunction<onFullScreenChangeEventDetail>`		否	全屏变化事件，detail = {`{direction, fullScreen}`}
onNetstatus	`BaseEventOrigFunction<onNetStatusEventDetail>`		否	网络状态通知，detail = {`{info}`}
onAudioVolumenotify	`BaseEventOrigFunction<{}>`		否	播放音量大小通知，detail = {`{}`}

API	微信小程序	H5	React Native
LivePlayerProps.src	✔️
LivePlayerProps.mode	✔️
LivePlayerProps.autoplay	✔️
LivePlayerProps.muted	✔️
LivePlayerProps.orientation	✔️
LivePlayerProps.objectFit	✔️
LivePlayerProps.backgroundMute	✔️
LivePlayerProps.minCache	✔️
LivePlayerProps.maxCache	✔️
LivePlayerProps.soundMode	✔️
LivePlayerProps.autoPauseIfNavigate	✔️
LivePlayerProps.autoPauseIfOpenNavigate	✔️
LivePlayerProps.onStateChange	✔️
LivePlayerProps.onFullScreenChange	✔️
LivePlayerProps.onNetstatus	✔️
LivePlayerProps.onAudioVolumenotify	✔️

mode 的合法值

参数	说明
live	直播
RTC	实时通话，该模式时延更低

orientation 的合法值

参数	说明
vertical	竖直
horizontal	水平

objectFit 的合法值

参数	说明
contain	图像长边填满屏幕，短边区域会被填充⿊⾊
fillCrop	图像铺满屏幕，超出显示区域的部分将被截掉

soundMode 的合法值

参数	说明
speaker	扬声器
ear	听筒

参数	类型	说明
code	`number`	状态码

参数	类型	说明
direction	`number`	方向
fullScreen	`number \| boolean`	全屏

参数	类型
info	`netStatus`

状态码

参数	说明
2001	已经连接服务器
2002	已经连接 RTMP 服务器,开始拉流
2003	网络接收到首个视频数据包(IDR)
2004	视频播放开始
2005	视频播放进度
2006	视频播放结束
2007	视频播放Loading
2008	解码器启动
2009	视频分辨率改变
-2301	网络断连，且经多次重连抢救无效，更多重试请自行重启播放
-2302	获取加速拉流地址失败
2101	当前视频帧解码失败
2102	当前音频帧解码失败
2103	网络断连, 已启动自动重连
2104	网络来包不稳：可能是下行带宽不足，或由于主播端出流不均匀
2105	当前视频播放出现卡顿
2106	硬解启动失败，采用软解
2107	当前视频帧不连续，可能丢帧
2108	当前流硬解第一个I帧失败，SDK自动切软解
3001	RTMP -DNS解析失败
3002	RTMP服务器连接失败
3003	RTMP服务器握手失败
3005	RTMP 读/写失败

API	微信小程序	H5	React Native
LivePlayer	✔️