海康威视web控件开发的正确姿势(1)

最新推荐文章于 2024-08-21 11:17:58 发布
最新推荐文章于 2024-08-21 11:17:58 发布
阅读量722 收藏 25
点赞数 13
分类专栏： 程序员 文章标签： 前端 javascript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qinglp/article/details/137885231
版权
本文介绍了如何将海康威视的web控件应用于Vue项目，详细讲述了从熟悉demo到定制开发的过程，包括遇到的问题、解决方法以及最终的代码实现。通过简化demo代码并封装成webVideo.js，成功实现在Vue中展示网络摄像头画面。
摘要由CSDN通过智能技术生成

https://open.hikvision.com/download/5cda567cf47ae80dd41a54b3?type=10&id=4c945d18fa5f49638ce517ec32e24e24

在这里插入图片描述

熟悉demo程序

==========================================================================

打开这个web控件开发包的文档，可以看到，这个控件是利用ActiveX控件和NPAPI实现的。IE上用ActiveX控件，Chrome基于NPAPI实现，并且需要安装codebase目录下的WebComponentsKit.exe插件。这里我们可以了解到，该控件不适用于高版本Chrome浏览器，这是一个很不爽的地方。不过目前还没有找到其他合适的方案，也只能试试这个方案了。

web控件说明

打开demo目录下的index.html，我们可以看到它支持的功能还是很多的。

而我并不需要这么多功能，只需要能把网络摄像头的画面呈现在项目页面上就好了。

海康web控件demo页面

定制开发

======================================================================

遇到的问题： 一开始也没有熟读这个控件的demo源码，就想着把从初始化到登录，再到预览这部分功能截

最低0.47元/天 解锁文章
海康威视WEB3.0控件开发包V1.0.9_CN
09-15
海康威视WEB3.0控件开发包V1.0.9_CN 支持H.265视频编码及H.264，亲测有效 内部包含WebComponentsKit.exe 的为海康威视web插件
海康威视web开发包
01-09
海康威视web开发包,海康威视SDK二次开发，支持外网访问海康威视监控设备
java开发调用海康威视摄像头的web端页面开发心得
热门推荐
lucius93的博客
07-18 9万+
最近在开发过程中  需要用到海康威视的摄像头 在web端展示  在各种百度之后 发现网上很难找到一个  简便，可靠的教程 在摸索着完成项目之后 ，决定写一篇攻略  造福有需求的小伙伴 言归正传   首先需要下载一个海康威视开发包（百度搜索“ 海康威视web开发包”）也可以给我留言索要 提供3.0开发包 第一步：打开下载好的文件之后在找到demo文件夹下cod
海康威视WEBSDK3.3控件开发-分屏预览多个摄像头
最新发布
qkdgz的博客
08-21 3810
Electron+vue3+vite实现海康威视WEBSDK3.3控件二次开发。实现多屏预览和摄像头切换。开发踩坑记录
海康威视 摄像头web 新版开发文档 含插件和多种功能demo
04-24
海康威视 摄像头web 新版开发文档 含插件和多种功能demo； demo可直接运行，如提示浏览器问题可注释相关代码；
海康威视web控件开发的正确姿势
前端原创分享，常年坚持记录和分享，全网阅读量超百万
07-18 5万+
最近一个vue的项目里面需要呈现某现场的实时视频，组里购买了一组海康威视的网络摄像头，是那种带管理程序的，通过ip，port，用户名，密码登录摄像头，但是不知道如何应用到web项目中。查找资料后，我在网上找到一个web控件开发包，于是在此基础上进行开发，实现vue项目需要的功能。 熟悉demo程序 ...
2024年前端最全海康威视web控件开发的正确姿势(1)，2024年最新面试都面试些什么
2401_84619606的博客
05-13 378
javascript是前端必要掌握的真正算得上是编程语言的语言，学会灵活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。
海康威视web控件开发的正确姿势(3)
2401_84435838的博客
05-03 976
/ 检查插件是否已经安装过alert(“您还未安装过插件，双击开发包目录里的WebComponentsKit.exe安装！”);return;// 初始化插件参数及插入插件});// 登录return;}, 10);// 退出return;// 获取通道return;// 模拟通道id: id,name: name})});},});// 获取端口return;if (oPort!= null) {
海康威视web控件开发的正确姿势，web中间开发
cwcnl25131的博客
04-06 1055
整理面试题，不是让大家去只刷面试题，而是熟悉目前实际面试中常见的考察方式和知识点，做到心中有数，也可以用来自查及完善知识体系。《前端基础面试题》，《前端校招面试题精编解析大全》，《前端面试题宝典》，《前端面试题：常用算法》PDF完整版点击这里免费领取整理面试题，不是让大家去只刷面试题，而是熟悉目前实际面试中常见的考察方式和知识点，做到心中有数，也可以用来自查及完善知识体系。《前端基础面试题》，《前端校招面试题精编解析大全》，《前端面试题宝典》，《前端面试题：常用算法》PDF完整版点击这里免费领取。
开发调用海康威视摄像头的web端页面
05-22
点击webComponents.exe安装 注意版本号和 32位 64位（这里跟正一下 木有64位尴尬尴尬） 如果没有合适的 请去官网下载 第二步：将文件夹中 demo.js demo.css webVideoCtrl.js 这3个文件导入你的项目，还需要jquery 没有的小伙伴可以导开发包里面的1.7
最新版海康威视WEB_SDK开发包V1.1.0
11-20
Web控件3.0基于ActiveX控件和NPAPI开发。接口封装与JavaScript脚本，已JavaScript接口形式提供用户集成，支持网页上实现预览、回放、云台控制等功能。
海康威视web开发控件和demo
03-08
海康威视web开发控件和demo，亲自测试过，可用。。。！
海康威视 WEB无插件开发包 V3.2
12-02
WEB3.2无插件版本开发包，支持高版本谷歌、火狐浏览器，同时需要设备支持Websocket取流。无插件版本需要使用nginx代理服务器。内附开发文档
海康威视 web开发3.0版
11-24
海康威视web开发包3.0版 亲测可用有需要的可以下载
海康威视web控件开发的正确姿势(2)
2401_84093407的博客
04-11 932
技术是没有终点的，也是学不完的，最重要的是活着、不秃。零基础入门的时候看书还是看视频，我觉得成年人，何必做选择题呢，两个都要。喜欢看书就看书，喜欢看视频就看视频。最重要的是在自学的过程中，一定不要眼高手低，要实战，把学到的技术投入到项目当中，解决问题，之后进一步锤炼自己的技术。技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。有需要面试题资料的朋友点击这里可以领取。技术是没有终点的，也是学不完的，最重要的是活着、不秃。
海康威视web控件开发包
11-13
这个“海康威视web控件开发包”提供了丰富的功能，便于开发者进行二次开发，实现定制化的视频播放、监控操作等功能。在C#环境下，利用这些控件可以轻松构建一个强大的Web视频监控系统。 该开发包的核心部分是用于在...
海康威视web控件开发+vue结合做网页开发-附件资源
03-05
海康威视web控件开发+vue结合做网页开发-附件资源
海康威视Web3.0控件开发包编程手册
"该文档是海康威视的Web3.0控件开发包的编程指南，主要针对使用海康威视Web开发的开发者。内容包括控件介绍、支持的设备、运行环境、版本更新、错误码说明以及一系列的函数调用顺序和功能说明。手册强调了其内容仅供...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值