自己动手实现纯Web远程监控系统(纯Web,跨浏览器)

想不想能够在网上看到自己家里的情况?罗技的网络摄像头又贵效果又不好,而且就只能摆一个死角度,而且页面上要安装插件,专业的监控系统死贵死贵,而且还是要用插件或者专门的软件,甚至有的还有端口限制,防火墙穿透能力极差。我们现在的目标就是在有限的资金投入下实现一个纯Web(没有专用插件),跨浏览器,支持摄像头的控制(水平270度,垂直210度,带变焦)的远程监控系统。甚至还能支持拍照和录像功能。

首先由于资金有限,所以我们软件不准备花一分钱,全部自己来写。硬件只要能满足要求我们用最便宜的(如果硬件肯多花钱当然效果也会好很多)

下面是我们需要采购的清单,部分比较昂贵的设备我参考了淘宝的价格。

产品

规格

价格

云台

301云台

150(淘宝价)

云台解码板

自带电源的万用解码板

320

摄像头

1/3" SONY ICX 409AK Color

420(淘宝价)

RS232-RS485转换头

通用

45

视频采集卡

视频采集卡--影视大师豪华版 (三诺)

 

180(淘宝价)

网线、串口线

超6类网线2根、RS232线一根

 

 

 当然为了安装这些硬件我们还需要一些工具比如网线钳,电烙铁,焊锡丝等。

为了能够实现我们之前所提到的功能,我们需要分三个步骤来完成。

第一个步骤是硬件安装。那么第一步就是找个稳定的安装面把云台装好,具体的安装过程就不说了,拧螺丝,会吧。

接下来需要把摄像头的数据线和控制线接好,数据线就是常规的AV线,控制线就是用网线自己焊的,接头在摄像头的包装盒里有。云台的控制线也是一样。然后我们就把云台和摄像头的控制线按照说明书上的格式在解码板上安装好,然后设置解码板的协议格式为pelco-d(具体的设置方式在说明书上有)。控制信号是通过串口发送的,我们将串口线接到电脑的串口上,另一端接到转接口头,转接头的Rs485这一端用网线就行了,只需要两根线芯就行了,这根网线的另一端接到解码板上就行了。至此控制链路的物理链路就打通了。连通性测试可以用万用表来完成。

第二步就是打通视频链路,首先是把采集卡装到电脑上,然后把av线插到采集卡上就行了。好了现在硬件都搞定了我们就可以来搞定软件了。

 

首先我们要实现云台的控制。云台控制是通过串口来实现,电脑的串口通过pelco-d协议与云台解码板通信。pelco-d协议介绍 

我们要自己实现这个协议,由于这个协议很简单,而且我们只有一个云台需要控制,所以就把地址位写死成01,然后所有的指令都固化成为一个长度为7 的Byte数组。上下左右+前后变焦+停止,一共7个指令我们用七个数组来写死:

ContractedBlock.gif ExpandedBlockStart.gif 封装指令的类
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> --> 1using System;
 2using System.Collections.Generic;
 3using System.Text;
 4
 5namespace PelcoDLib
 6ExpandedBlockStart.gifContractedBlock.gif{
 7    class ControlData
 8ExpandedSubBlockStart.gifContractedSubBlock.gif    {   
 9        //                                    保留  地址  指令1 指令2 数据1 数据2 验证
10ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] Up =           0xff0x010x000x100x000x3f0x50 };
11ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] Down =         0xff0x010x000x080x000x3f0x48 };
12ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] Left =         0xff0x010x000x040x3f0x000x44 };
13ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] Right =        0xff0x010x000x020x3f0x000x42 };
14
15ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] Forward =      0xff0x010x000x200x000x000x21 };
16ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] Back =         0xff0x010x000x400x000x000x41 };
17
18ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] Stop =         0xff0x010x000x000x000x000x00 };
19
20ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] FocusForward = 0xff0x010x000x800x000x000x81 };
21ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] FocusBack =    0xff0x010x010x000x000x000x02 };
22
23ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] SetPoint = 0xff0x010x000x030x000x010x05 };
24ExpandedSubBlockStart.gifContractedSubBlock.gif        public static byte[] GotoPoint = 0xff0x010x000x070x000x010x09 };
25
26        public static SortedDictionary<stringbyte[]> Commands = new SortedDictionary<stringbyte[]>();
27
28        static ControlData()
29ExpandedSubBlockStart.gifContractedSubBlock.gif        {
30            Commands.Add("up", Up);
31            Commands.Add("down", Down);
32            Commands.Add("left", Left);
33            Commands.Add("right", Right);
34            Commands.Add("for", Forward);
35            Commands.Add("back", Back);
36            Commands.Add("ffor", FocusForward);
37            Commands.Add("fback", FocusBack);
38            Commands.Add("setp", SetPoint);
39            Commands.Add("gop", GotoPoint);
40        }

41
42    }

43}

44

 

然后我们通过串口通信的类发送这些指令就行了,下面是控制云台向上运动的方法:

ContractedBlock.gif ExpandedBlockStart.gif Code
<!--<br /> <br /> Code highlighting produced by Actipro CodeHighlighter (freeware)<br /> http://www.CodeHighlighter.com/<br /> <br /> -->1public static void Up()
2ExpandedBlockStart.gifContractedBlock.gif        {
3            using (SerialPort port = GetPort())
4ExpandedSubBlockStart.gifContractedSubBlock.gif            {
5                if(!port.IsOpen)
6                    port.Open();
7                port.Write(ControlData.Commands[ConfigurationManager.AppSettings["up"]], 07);
8            }

9        }

 

注意一点:一旦执行了指令云台就会一直按照这个指令运动下去,直到执行Stop指令为止。

最后我们只需要能够在页面上执行到这些方法就能控制云台了,所以我们在电脑上配置好IIS,创建一个站点,在站点上创建一个页面,我们通过这个页面获取指令的参数来调用相应的方法。

比如

private void GoUp()
{
     cam.Up();

}

 

之后我们用ajax去调用这个页面,就实现了控制云台的功能,我是用的flash用loadvars的方式去调用的,异曲同工不是么。

 

实现视频的方法要简单一些,我们可以用media encoder+media Service来实现,不过这个组合的延迟太严重了,大概十多而是秒,这个时候操作会变得很奇怪,所以我用的flash encoder+fms来实现从采集卡到Web页面显示的功能,这两个都有免费的开发版(10个并发,商业应用的话可以花钱买lisence)。我们在电脑上安装好这两个软件后,fms会以服务的方式运行,flash encoder运行后会自动找到采集设备,设置好码率,大小,比例等参数后设置好fms的地址就可以开始推送了,开始推送后会自动在fms创建application。

这个时候我们在网站上创建一个页面,把控制的flash或者ajax程序放上去,然后加入一个flash的播放器,地址设置为fms的app的地址,然后我们就能够在页面上看到图像了,而且还能够去控制摄像头运动。当然我们也可以自己用flash写一个播放器。

 

效果的话,我可不希望在家被偷窥,所以大家可以去 大熊猫网站 看看,这个网站的应用就是按照类似的方式实现的,不过摄像头换成了sony的高档货,3000多一个,太清楚啦,甚至可以拉很近看到地上的毛毛虫。如果是网上就不用看啦,摄像头在室外,晚上一片漆黑。不过早上8点到10点真的很容易看到熊猫哦。


 

 


 

 


 

 

 

 


 


 

 

 

 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
基于嵌入式web技术的网络视频监控系统是一种将视频监控系统集成到嵌入式设备中的网络化解决方案。该系统通过使用嵌入式硬件和软件技术,可以实时监控和管理多个视频摄像头的画面,并通过网络传输监控数据到远程终端。 该系统的核心是嵌入式设备,其具有小型化、低功耗、高性能的特点,可以运行轻量级的操作系统和网络服务。通过网络连接,监控设备可以将视频流传输到远程终端,用户可以通过浏览器或专用客户端实时观看视频画面,并对监控设备进行控制和配置。 基于嵌入式web技术的网络视频监控系统具有以下优点: 1. 灵活性:该系统可以连接到任何具有网络连接的设备,用户可以通过各种终端(如电脑、手机)实时查看视频画面,方便快捷。 2. 扩展性:可以轻松扩展监控设备的数量和范围,满足不同规模和需求的监控场景。 3. 高效性:嵌入式设备在处理视频数据时具有高效性和稳定性,能够同时处理多个视频流并实时传输。 4. 安全性:该系统支持数据加密和身份验证,保障监控数据的安全性和隐私性。 5. 可管理性:用户可以通过web界面实时监控和管理视频设备,如调整摄像头视角、录制视频和设置报警规则等。 总而言之,基于嵌入式web技术的网络视频监控系统为用户提供了方便、高效、可扩展和安全的监控解决方案,具有广泛的应用前景,可以应用于各种领域,如家庭监控、商业安防等。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值