EZUIKit.js萤石云vue项目使用

最新推荐文章于 2025-02-22 15:26:28 发布

巴音布鲁克的干

最新推荐文章于 2025-02-22 15:26:28 发布

阅读量1.7k

点赞数 7

分类专栏： vue.js 文章标签： javascript vue.js 前端

本文链接：https://blog.csdn.net/XYX8958/article/details/142559971

版权

vue.js 专栏收录该内容

20 篇文章

订阅专栏

EZUIKit.js 是萤石云（Ezviz）提供的一款用于Web端的视频播放和控制的JavaScript库。它允许开发者在网页上轻松集成视频监控、对讲、录像回放等功能，适用于安防监控、智能家居等场景。通过EZUIKit.js，你可以方便地访问萤石云平台上的摄像头和其他智能设备。

1. 引入EZUIKit.js

npm引入

npm install ezuikit --save

或者通过CDN引入

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My Project</title>
  <!-- 引入EZUIKit.js -->
  <script src="https://cdn.jsdelivr.net/npm/ezuikit@latest/dist/ezuikit.min.js"></script>
</head>
<body>
  <div id="app"></div>
</body>
</html>

2. 使用

<template>
  <div ref="playerContainer" id="SkeyeWebPlayer1"></div>
</template>

    import EZUIKit from "ezuikit-js";
    function ezuikit1(url: string, accessToken: string) {
      playr1 = new EZUIKit.EZUIKitPlayer({
        id: "SkeyeWebPlayer1", // 视频容器ID
        accessToken: accessToken,
        url: url,
        template: 'simple', // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版; theme-可配置主题；
        plugin: ["talk"], // 加载插件，talk-对讲
        width: 'auto',
        height: 'auto',
      });
        const playPromise = playr1.play();

      // 处理播放成功的情况
      playPromise.then(() => {
        console.log("播放成功");
      }).catch((error) => {
        // 处理播放失败的情况
        console.error("播放失败:", error);
      });
    }

参数名	类型	描述	是否必选
accessToken	String	授权过程获取的access_token	Y
deviceSerial	String	设备序列号例如427734222，均采用英文符号，限制最多50个字符	Y
channelNo	Integer	通道号，非必选，默认为1	N
protocol	Integer	流播放协议，1-ezopen、2-hls、3-rtmp、4-flv，默认为1	N
code	String	ezopen协议地址的设备的视频加密密码	N
expireTime	Integer	过期时长，单位秒；针对hls/rtmp/flv设置有效期，相对时间；30秒-720天	N
type	String	地址的类型，1-预览，2-本地录像回放，3-云存储录像回放，非必选，默认为1；回放仅支持rtmp、ezopen、flv协议	N
quality	Integer	视频清晰度，1-高清（主码流）、2-流畅（子码流）	N
startTime	String	本地录像/云存储录像回放开始时间,云存储开始结束时间必须在同一天，示例：2019-12-01 00:00:00	N
stopTime	String	本地录像/云存储录像回放结束时间,云存储开始结束时间必须在同一天，示例：2019-12-01 23:59:59	N
supportH265	Integer	请判断播放端是否要求播放视频为H265编码格式,1表示需要，0表示不要求	N
playbackSpeed	String	回放倍速。倍速为 -1（支持的最大倍速）、0.5、1、2、4、8、16；仅支持protocol为4-flv 且 type为2-本地录像回放（部分设备可能不支持16倍速）或者 3-云存储录像回放	N
gbchannel	String	国标设备的通道编号，视频通道编号ID	N