海康大华天地伟业网络摄像头chrome浏览器web二次开发

海康大华天地伟业网络摄像头chrome浏览器二次开发

海康大华天地伟业网络摄像头chrome浏览器web二次开发

由于工作的原因需要开发海康和大华，还有天地伟业的摄像头，而且必须是本地部署开发，每个厂家网页版摄像头接口都不一样，而且在本地浏览器播放实时画面的问题，大多数都是基于ie浏览器，所以原生开发包不太适用多种浏览器，存在缺陷！由于摄像头是rtsp格式的，h5原生不支持这种格式，网上查了很多教程大多是使用rtsp转rtmp，不过rtmp需要falsh的支持，但是在chrome已经默认禁用、包括未来也会逐渐淘汰，所有最终这种方案被淘汰。

于是我想应该把rtsp转化成一种类似http协议的方式，能够直接被h5识别，于是我google，百度就不用说了，查了半天全是没有的东西。终于我找到了一种叫jsmpeg的插件，它主要是通过webSocket发送MPEG，前端通过js解析MPEG不断绘制canvas，包括音频。最终测试的结果就是一个1920*1080分辨率的画面延时大概的1.0s左右，超出我的预料，性能居然这么高。后台观察发现浏览器使用了GPU加速

本项目预览介绍

项目效果：

1. 本项目采用视频框架为Ffmpeg+Node.js+jsmpeg
2. 本项目采用的开发框架为ssm
3. 主要实现摄像头实时预览
4. 摄像头在线检测
5. 视频框架下载地址（建议直接下载&#x