0.1.5 • Published 4 years ago
ezuikit-ts v0.1.5
EZUIKit-JavaScript-npm
轻应用npm版本,降低接入难度,适配自定义UI,适配主流框架
低延时预览,云存储回放,SD卡回放
功能API丰富,如:播放控制,音频控制,视频截图,实时获取视频OSDTime,视频录制,设备对讲,电子放大,全屏等
feat🎉: 全新的typescript重构版本,并且新增了更多API
获取ezuikit-ts
$ npm install ezuikit-ts引入ezuikit-js
import EZUIKit from 'ezuikit-ts';开始使用 - 初始化
基本使用
创建DOM
<div id="video-container"></div>播放器初始化
var player = new EZUIKitPlayer({
id: 'video-container', // 视频容器ID
accessToken: 'at.3bvmj4ycamlgdwgw1ig1jruma0wpohl6-48zifyb39c-13t5am6-yukyi86mz',
url: 'ezopen://open.ys7.com/203751922/1.live',
})方法调用
示例: 停止播放
player.stop();示例: 执行播放(自动播放为false,自定义触发播放/切换播放地址)
player.play();
// 切换播放地址场景(建议先执行stop方法停止上次取流)
player.play({
url: 'ezopen://open.ys7.com/203751922/1.rec?begin=202001000000&end=202001235959'
});使用说明
初始化
| 参数名 | 类型 | 描述 | 是否必选 |
|---|---|---|---|
| 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 |
| templete | 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 |
| openSoundCallBack | function | 开启声音回调 | N |
| closeSoundCallBack | function | 关闭回调 | N |
| startSaveCallBack | function | 开始录像回调 | N |
| stopSaveCallBack | function | 结束录像回调 | N |
| capturePictureCallBack | function | 截图回调 | N |
| fullScreenCallBack | function | 全屏回调 | N |
| getOSDTimeCallBack | function | 获取OSD时间回调 | N |
方法集合
| 方法名 | 类型 | 描述 | 使用示例 |
|---|---|---|---|
| stop | function | 结束播放 | player.stop() |
| openSound | String | 开启声音 | player.openSound() |
| closeSound | String | 关闭声音 | player.closeSound() |
| startSave | int | 开始录像 | player.startSave() |
| stopSave | int | 结束录像 | player.stopSave() |
| capturePicture | function | 视频截图 | player.capturePicture() |
| fullScreen | function | 全屏(自动适配移动端pc端全屏) | player.fullScreen() |
| cancelFullScreen | function | 取消全屏 | player.cancelFullScreen() |
| getOSDTime | function | 获取播放时间回调 | player.getOSDTime() |
| startTalk | function | 开始对讲 | player.startTalk() |
| stopTalk | function | 结束对讲 | player.stopTalk() |
新增API🎉
| 方法名 | 类型 | 描述 | 使用示例 |
|---|---|---|---|
| destory | Promise | 销毁 | player.destory() |
新增headers Options🎉
| 参数名 | 类型 | 描述 | 是否必选 |
|---|---|---|---|
| history | function | 结合自己业务需要,显示历史回放icon,点击回调函数 | N |
tips: 重写了sdk的haeder控制栏显示控制,有时间会继续迭代