首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >通过自定义EasyNVR的Logo、标题、版权等相关信息构建属于自己的摄像机网页视频直播服务

通过自定义EasyNVR的Logo、标题、版权等相关信息构建属于自己的摄像机网页视频直播服务

作者头像
EasyNVR
发布2020-04-23 15:28:46
发布2020-04-23 15:28:46
8590
举报
文章被收录于专栏:EasyNVREasyNVR

随着互联网基础设施建设的发展,4G/5G/NB-IoT各种网络技术、物联网技术的大规模商用,视频随时随地可看、可控、可回溯的诉求越来越多,互联网思维、架构和技术引入进传统监控行业里,成为新形势下全终端监控的基础需求。因使用区域受限、实施成本和入口门槛高,传统监控行业和摄像机直播系统无法借力优质云资源搭建属于自己的监控云平台,客户终端出不了监控的内网,无法做到公网实时监控与录像回放,更别说用手机、微信、H5、无插件随时随地看视频了,之前的方案中我们提到的EasyNVR产品已经完全可以解决以上痛点。

今天着重说明通过自定义EasyNVR、EasyNVS的LOGO、标题、版权等相关信息构建专属于自己的视频云监控平台。

据统计,每年有超1000家的企业购买和使用EasyNVR,EasyNVR已被越来越多的企业用户所接受和使用,并作为其主要的流媒体接入服务。从某种程度上说,EasyNVR解决了广大企业用户在传统IPC摄像机、网路硬盘录像机NVR,互联网化接入难的问题,由于EasyNVR(以及其配套的免费EasyNVS系统)拥有相对简洁、大方的页面样式,所以部分企业用户希望直接使用EasyNVR官方配套的前端Web网页,并将其引用到自身的实际项目中,这里我们将具体就如何自定义修改EasyNVR(机器配套的免费EasyNVS系统)进行全方位的讲解。

问题分析

由于EasyNVR和EasyNVS的前端页面是基于VUE+webpack进行压缩,因此对外所提供的前端页面是压缩完成后,直接使用的压缩版本,这样的有利于减小项目体积,更加有利于浏览器的可读性。 但是这种区别于传统html+js的源码编写方式,让用户自主读改源码难度就更大了,下面我们将具体介绍如何去自主修改前端源码!!

解决问题-自我修改源码(以EasyNVR为例)

  • 软件包根目录的www文件夹就是用于放置前端页面,
  • 我们启动EasyNVR服务,在页面直接访问可以看到web页面的所有样式!!

我们可以看到,页面标注的地方都是具有EasyNVR自身的产品样式的特征的前端,那么我们在不改变整体架构的同时如何修改页面中对应的logo字样的标志呢?

  1. 找个合适的编辑器,打开EasyNVR软件包根目录的经过压缩过会的前端代码!(这边使用的是VSCode)
  1. 找出对应的字样进行文字的替换更改!如"www.easynvr.com"

找到后将其全部全局替换为自身所需要的信息即可。

  1. 替换完成,刷新页面,发现页面的信息样式就会发生变化
  1. 介绍总结一下EasyNVR所出现的压缩文件位置!
  • index.****.js文件中出现的EasyNVR的完整字样!
  • 该文件中只需要改这一处就可以,该处是修改页面左上角的EasyNVR字样 保存文件,查看效果:
  • 登录界面样式的修改:
  • 将对应位置的文字修改为自身需要的样式 保存完成,刷新页面看到效果!!!
  • 配置页面相关选项名称修 找出config.***.js文件中EasyNVR完整字样替换为自身所需字样,修改并保存
  • 此时完成页面所有样式的更改
  1. 完成更改,提交项目使用!!!

注意:在使用过程中遇到任何问题都可以第一时间通过EasyNVR官网(http://www.easynvr.com)咨询电话进行咨询沟通!!

EasyNVR方案架构

方案一

  • 服务器在本地,与IPCamera/NVR/编码器同在一个局域网,拥有一个内网IP地址又具有外网访问地址
  • 多个IPCamera/NVR/编码器仅有内网IP地址(无外网IP),EasyNVR通过内网拉取IPCamera/NVR/编码器的流数据

方案二

  • 服务器在公网(比如云主机、公网服务器),与设备不在同在一个局域网内
  • IPCamera/NVR/编码器单独或者共有固定的公网IP地址,EasyNVR服务器可以直接访问到设备

方案三

  • EasyNVS服务器部署在公网(比如云主机、公网服务器)
  • 有多个内网现场的直播设备需要进行公网直播
  • EasyNVR对接EasyNVS可以利用网络实现按需直播,同时屏蔽各种网络环境问题,适用于有线、WIFI、4G、专网
  • 支持云端运维,公网具体运维每个现场EasyNVR设备
  • EasyNVS管理平台能获取到EasyNVR的所有能力,并进行互联网化输出,同时进行统一化的管理和接口输出。
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2019-05-09 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 问题分析
  • 解决问题-自我修改源码(以EasyNVR为例)
  • EasyNVR方案架构
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档