阿里IOT播放器 uniapp iOS端插件说明
2022-11-15 本文已影响0人
reyzhang
插件名称 ：AliIotPlayer
.nvue中导入
<template>
<div>
<AliIotPlayer ref="iotplayer" style="width:750px;height:300px" type="1" rtmpPath="" iotId="" @playStateChanged="onPlayStateChanged"
@playerViewDidLoad="onPlayerViewDidLoad"></AliIotPlayer>
<button type="primary" @click="startPlay">播放</button>
<button type="primary" @click="stopPlay">停止播放</button>
<button type="primary" @click="videoSnap">视频截图</button>
<button type="primary" @click="getPlayerState">直播状态</button>
</div>
</template>
js脚本:
<script>
console.log("it's me");
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
/**
* 监听viewDidLoad是否被执行
*/
onPlayerViewDidLoad(e) {
console.log(e.detail);
},
/**
* 监听播放状态
*/
onPlayStateChanged(e) {
console.log(e.detail);
},
onErrorOccurred(e) {
console.log(e.detail);
},
onPlayStopped(e) {
console.log(e.detail);
},
/**
* 开始播放
*/
startPlay() {
console.log(this.$refs.iotplayer);
this.$refs.iotplayer.startPlay((ret) => {
console.log(ret);
});
},
/**
* 停止播放
*/
stopPlay() {
this.$refs.iotplayer.stopPlay((ret) => {
console.log(ret);
});
},
/**
* 视频截图
*/
videoSnap() {
this.$refs.iotplayer.getSnapshot((ret) => {
console.log(ret);
});
},
/**
* 获取播放器状态
*/
getPlayerState() {
this.$refs.iotplayer.getPlayerState((ret) => {
console.log(ret);
});
}
}
}
</script>
插件属性
- type 播放类型
| type值 | 描述 |
|---|---|
| 1 | 直播 |
| 2 | 以录像时间播放 |
| 3 | 以录像文件名播放 |
- iotId : 从阿里获取到的iotId
- rtmpPath：从阿里获取到的rmpPath
- vodFileName：播放文件名。 当type =3时 此参数必传， 为其他时可空
- debug: 是否开始日志输出 ： 布尔
插件事件
playStateChanged : 监听播放状态的改变
playConnected: 监听播放器是否已连接成功
playStopped： 监听播放器是否已停止播放
errorOccurred： 监听播放器是否有错误产生
插件方法
- startPlay() : 直播播放
- stopPlay() : 停止直播
- getSnapshot(callback) : 视频截图，并返回
- getPlayerState(callback) : 监听播放状态
- releasePlayer() : 释放资源
