实现监控摄像头RTSP视频流-Web端人脸识别-ffmpeg+websocket+jsmpeg方法总结

心得 专栏收录该内容
7 篇文章 0 订阅

需求

最近有一个需求,用户打开一个网页查看单位门口的一个海康摄像头,延时不能太大,该网页需要实现人脸识别功能。

分析

通过网上查看各方资料,以及自己的多次尝试,最终发现web端实现监控摄像头人脸识别最适合我们的方法是ffmpeg+websocket+jsmpeg实现视频流实时绘制到canvas上,然后使用TensorFlow.js+face-api.js读取canvas上的图像进行人脸识别。

实现步骤

1、安装配置ffmpeg+websocket+jsmpeg

安装配置ffmpeg+websocket+jsmpeg网上的方法很多,ffmpeg主要用来读取海康监控摄像头的RTSP视频流并转码为二进制流推送到websocket服务上。
我用到的ffmpeg推送代码如下:

ffmpeg -rtsp_transport tcp -i "rtsp://admin:海康摄像头密码@192.168.1.4:554/h264/ch1/main/av_stream" -q 0 -f mpegts -codec:v mpeg1video -s 1000x600 -r 30 http://192.168.1.16:8081/socket密码

启动websocket的代码如下

node websocket-relay.js socket密码 8081 8082

注意socket密码上下统一。通过这个方法可以把RTSP的视频流推送到socket服务器。下面就是绘制视频流。

2、绘制视频流

绘制视频流使用的是jsmpeg,下面是我实现的方法:

<div><canvas id="video-canvas" style="display: block;"></canvas></div>
<script type="text/javascript">
		var canvasVideo = document.getElementById('video-canvas');
		var url = 'ws://192.168.1.16:8082/';
		var player = new JSMpeg.Player(url, {
		    canvas: canvasVideo,
		    audio: false,
			preserveDrawingBuffer:true
		});
	</script>

由于jsmpeg通过显卡进行绘制,因此如果不设置preserveDrawingBuffer:true这个参数会导致face-api.js无法读取canvas中当前的图像。

3、TensorFlow.js+face-api.js实现人脸识别

jsmpeg实时在canvas上重绘除了视频流,下面就看google的前端深度学习框架tensorFlow.js了,它可以调用Python中TensorFlow或keras已训练好的模型,也可以自己训练模型或者在已有模型上继续训练,face-api.js就是基于temsorFlow.js实现的一个人脸识别库。
通过face-api官方demo结合上面绘制好的canvas就可以实现视频中人脸识别了。具体教程还是得看官方教程比较复杂,我从官方demo中获取到的精华就是

        await changeFaceDetector(TINY_FACE_DETECTOR);
        faceMatcher = await createBbtFaceMatcher(1)

updateResults函数中读取canvas我是这样写的,输入的图像通过canvas中的toDataURL转为base64编码作为输入。

$("#imgUrlInput").attr("src", canvasVideo.toDataURL("image/png"));
        const inputImgEl = $("#imgUrlInput").get(0);
        const options = getFaceDetectorOptions()
        const results = await faceapi
            .detectAllFaces(inputImgEl, options)
            .withFaceLandmarks()
            .withFaceDescriptors()
       drawFaceRecognitionResults(results);

run函数中我使用了小脸识别,并且使用一张基图作为比对图。

结果

最终可以通过PC端访问也可以通过手机端访问查看摄像头视频并实现实时人脸识别,识别结果在服务器上存储。因为是实时人脸识别,因此我们还通过drawFaceRecognitionResults函数绘制了被识别人的信息实时显示在这个人的头顶上,如姓名、性别、科室、特长等信息。另外,网页打开的视频流运行一天延时依然能够保持在0.5s以内,这个还是比较满意的,之前试了几种方法延时都很大。

致歉

以上是我做监控摄像头RTSP视频流实现Web端人脸识别的一些新得,时间关系写的比较粗略,见谅。

  • 2
    点赞
  • 4
    评论
  • 14
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

相关推荐
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值