ezuikit-js视频功能
获取ezuikit-js
使用npm下载
$ npm install ezuikit-js
引入ezuikit-js
import EZUIKit from 'ezuikit-js';
创建dom元素
<div id="video-container"></div>
注意:如果div上面写的有v-if逻辑条件,<div id="video-container" v-if="show"></div>
请务必条件为true页面dom元素渲染成功后再进行new EZUIKit.EZUIKitPlayer实例初始化,最好v-if的变量值初始默认为true show: true,
后续调用接口后再赋新值.
播放器初始化
this.player = new EZUIKit.EZUIKitPlayer({
id: 'video-container', // 视频容器ID
accessToken: 'at.3bvmj4ycamlgdwgw1ig1jruma0wpohl6-48zifyb39c-13t5am6-yukyi86mz',
url: 'ezopen://open.ys7.com/203751922/1.live',
})
方法调用
//停止播放 (关闭页面时一定要停止播放否则软件内存会满,直接卡死)
this.player.stop();
this.player.stop().then(() => {
console.log("执行播放成功后其他动作")
})
//执行播放
this.player.play();
//切换地址播放(注意需要先执行stop方法停止上次取流)
this.player.stop().then(() => {
this.player.play({url: 'ezopen://open.ys7.com/203751922/1.rec?begin=202001000000&end=202001235959'})
})
//关闭声音
this.player.openSound()
初始化参数
参数名 |
类型 |
描述 |
是否必选 |
id |
String |
播放器容器DOM的id |
Y |
accessToken |
String |
授权过程获取的access_token |
Y |
url |
String |
视频ezopen协议播放地址 |
Y |
audio |
int |
是否默认开启声音 1:打开(默认) 0:关闭 |
N |
width |
int |
视频宽度,默认值为容器容器DOM宽度 |
N |
height |
int |
视频高度,默认值为容器容器DOM高度 |
N |
template |
string |
播放器模板,可以通过选定模板,使用内置的播放器样式,组件 simple:极简版;standard:标准版;security:安防版;vioce:语音版 |
N |
header |
Array |
视频头部可选UI组件,可选值:capturePicture:截图,save:录像保存,zoom:电子放大 |
N |
footer |
Array |
视频底部部可选UI组件,可选值:talk:对讲,broadcast:语音播报,hd:高清标清切换,fullScreen:全屏 |
N |
plugin |
Array |
按需加载插件,可选值: talk:对讲 |
N |
handleSuccess |
function |
播放成功回调 |
N |
handleError |
function |
播放错误回调 |
N |
方法集合
方法名 |
类型 |
描述 |
使用示例 |
stop |
function |
结束播放 |
|
openSound |
String |
开启声音 |
|
closeSound |
String |
关闭声音 |
|
startSave |
int |
开始录像 |
|
stopSave |
int |
结束录像 |
|
capturePicture |
function |
视频截图 |
|
fullScreen |
function |
全屏(自动适配移动端pc端全屏) |
|
cancelFullScreen |
function |
取消全屏 |
|
getOSDTime |
function |
获取播放时间回调 |
|
startTalk |
function |
开始对讲 |
|
stopTalk |
function |
结束对讲 |
|