mjpg-streamer+frp+公网服务器实现微信小程序实时监控方案

服务器端 —-> 使用frps搭建服务

下载编译安装frp

下载:

wget https://github.com/fatedier/frp/releases/download/v0.44.0/frp_0.44.0_linux_amd64.tar.gz
tar -zxvf frp_0.44.0_linux_amd64.tar.gz 
cd frp_0.44.0_linux_amd64/

修改frps.ini为如下:

[common]
bind_port = 8090
vhost_http_port = 8090

具体服务器端详细配置参考这里:服务端配置 | frp (gofrp.org)

开放8090端口:

sudo iptables -I INPUT -p tcp --dport 8090 -j ACCEPT(或者在宝塔面板中开放8090端口)

在云服务器设置防火墙中打开端口

开发板使用mjpg-streamer+frpc搭建客户端

确保摄像头可用

fuqiang@ubuntu:~$ ls -al /dev/video*
crw-rw----+ 1 root video 81, 0 Oct 19 04:13 /dev/video0
crw-rw----+ 1 root video 81, 1 Oct 19 04:13 /dev/video1

下载编译安装mjpg-streamer

git clone https://github.com/jacksonliam/mjpg-streamer.git
cd mjpg-streamer/mjpg-streamer-experimental/
make
sudo make install

编译后文件夹内容如下:

fuqiang@ubuntu:~/workspace/mjpg-streamer/mjpg-streamer-experimental$ tree -L 1
.
├── _build
├── cmake
├── CMakeLists.txt
├── Dockerfile
├── docker-start.sh
├── input_file.so
├── input_http.so
├── input_uvc.so
├── LICENSE
├── makedeb.sh
├── Makefile
├── mjpg_streamer
├── mjpg_streamer.c
├── mjpg_streamer.h
├── mjpg_streamer@.service
├── output_file.so
├── output_http.so
├── output_rtsp.so
├── output_udp.so
├── plugins
├── postinstall.sh
├── README.md
├── scripts
├── start.sh
├── TODO
├── utils.c
├── utils.h
└── www

5 directories, 23 files

修改start.sh,使用如下命令:

./mjpg_streamer -i "./input_uvc.so -d /dev/video0 -n -f 15 -r 320x240"  -o "./output_http.so -p 8090 -w ./www" 

本地测试,执行

./start.sh

成功启动会显示如下信息:

fuqiang@ubuntu:~/workspace/mjpg-streamer/mjpg-streamer-experimental$ ./start.sh 
MJPG Streamer Version: git rev: 310b29f4a94c46652b20c4b7b6e5cf24e532af39
 i: Using V4L2 device.: /dev/video0
 i: Desired Resolution: 320 x 240
 i: Frames Per Second.: 15
 i: Format............: JPEG
 i: TV-Norm...........: DEFAULT
 o: www-folder-path......: ./www/
 o: HTTP TCP port........: 8090
 o: HTTP Listen Address..: (null)
 o: username:password....: disabled
 o: commands.............: enabled

这时候,浏览器通过下面网址应该可以显示画面:

http://localhost:8090/stream.html

下载编译安装frp

下载:

wget https://github.com/fatedier/frp/releases/download/v0.44.0/frp_0.44.0_linux_amd64.tar.gz
tar -zxvf frp_0.44.0_linux_amd64.tar.gz 
cd frp_0.44.0_linux_amd64/

修改frpc.ini为:

[common]
server_addr = 114.132.63.31
server_port = 8090

[web]
type = http
#local_ip = 127.0.0.1
local_port = 8090
remote_port = 8090
custom_domains = 114.132.63.31

具体客户端参数配置参考这里:客户端配置 | frp (gofrp.org) 和 代理配置 | frp (gofrp.org)

运行

服务器端

./frps -c frps.ini

输出信息为:

lighthouse@VM-20-7-ubuntu:~ $ cd frp_0.44.0_linux_amd64/
lighthouse@VM-20-7-ubuntu:~/frp_0.44.0_linux_amd64 $ ./frps -c frps.ini 
2022/10/19 19:52:39 [I] [root.go:209] frps uses config file: frps.ini
2022/10/19 19:52:39 [I] [service.go:194] frps tcp listen on 0.0.0.0:8090
2022/10/19 19:52:39 [I] [service.go:237] http service listen on 0.0.0.0:8090
2022/10/19 19:52:39 [I] [root.go:218] frps started successfully
2022/10/19 19:52:44 [I] [service.go:450] [9adaae081a5373ec] client login info: ip [14.123.255.169:15815] version [0.44.0] hostname [] os [linux] arch [amd64]
2022/10/19 19:52:44 [I] [http.go:93] [9adaae081a5373ec] [web] http proxy listen for host [114.132.63.31] location [] group [], routeByHTTPUser []
2022/10/19 19:52:44 [I] [control.go:465] [9adaae081a5373ec] new proxy [web] type [http] success

开发板端

./start.sh

输出信息为:

fuqiang@ubuntu:~/workspace/mjpg-streamer/mjpg-streamer-experimental$ ./start.sh 
MJPG Streamer Version: git rev: 310b29f4a94c46652b20c4b7b6e5cf24e532af39
 i: Using V4L2 device.: /dev/video0
 i: Desired Resolution: 320 x 240
 i: Frames Per Second.: 15
 i: Format............: JPEG
 i: TV-Norm...........: DEFAULT
 o: www-folder-path......: ./www/
 o: HTTP TCP port........: 8090
 o: HTTP Listen Address..: (null)
 o: username:password....: disabled
 o: commands.............: enabled

再执行:

./frpc -c frpc.ini

输出信息为:

fuqiang@ubuntu:~/workspace/frp_0.44.0_linux_amd64$ ./frpc -c frpc.ini 
2022/10/19 04:52:44 [I] [service.go:349] [9adaae081a5373ec] login to server success, get run id [9adaae081a5373ec], server udp port [0]
2022/10/19 04:52:44 [I] [proxy_manager.go:144] [9adaae081a5373ec] proxy added: [web]
2022/10/19 04:52:44 [I] [control.go:181] [9adaae081a5373ec] [web] start proxy success

测试

在一台PC浏览器上输入:

http://114.132.63.31:8090/?action=stream

会显示出相同画面 :

微信小程序实现

小程序注册

在这里进行小程序注册:微信小程序 (qq.com)

下载微信开发者工具

在这里下载:微信开发者工具下载地址与更新日志 | 微信开放文档 (qq.com)

开始编写小程序

 

index.wxml中添加如下:

<view class="bj">
    <view class="container">
        <text class="bt">乐梵在哪</text>
        <image class="photo" src="http://114.132.63.31:8090/?action=stream" mode="aspectFit"></image>
    </view>
</view>

点击上面的“编译”,可以在调试程序中预览效果

点击“真机调试”,可以生成二维码,微信扫码在手机上看效果

 

效果确认完成后,点击右上角的“上传”,代码会上传到版本库进行管理

 

再点击“提交审核”,会由腾讯官方进行审核,审核通过即可上线

 

就可以在微信中搜索到这个小程序并使用了

 

到此为止,一条完整监控链路搭建完成!

mjpg-streamer初初探(MJPG-streamer / Wiki / Home (sourceforge.net)

五分钟拆解流媒体入门项目 MJPG-Streamer (qq.com)

frp初初探(frp (gofrp.org)

frp 采用 C/S 模式,将服务端部署在具有公网 IP 的机器上,客户端部署在内网或防火墙内的机器上,通过访问暴露在服务器上的端口,反向代理到处于内网的服务。 在此基础上,frp 支持 TCP, UDP, HTTP, HTTPS 等多种协议,提供了加密、压缩,身份认证,代理限速,负载均衡等众多能力。官方文档:文档 | frp (gofrp.org)

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
首先,你需要安装mjpg-streamer到你的树莓派上,可以通过以下命令进行安装: ``` sudo apt-get update sudo apt-get install subversion libjpeg-dev imagemagick libv4l-dev svn co https://svn.code.sf.net/p/mjpg-streamer/code/mjpg-streamer mjpg-streamer cd mjpg-streamer/mjpg-streamer make sudo make install ``` 安装完毕后,你需要下载并安装OpenCV,可以通过以下命令进行安装: ``` sudo apt-get install libopencv-dev python-opencv ``` 现在,你已经准备好开始使用mjpg-streamer和OpenCV来实现人形检测了。以下是一些基本步骤: 1. 启动mjpg-streamer ``` cd /usr/local/share/mjpg-streamer/ ./mjpg_streamer -i "input_uvc.so" -o "output_http.so -w ./www" ``` 这将启动mjpg-streamer并将其绑定到默认的视频设备(通常是/dev/video0)。现在你可以在浏览器中输入你的树莓派IP地址和端口号(默认为8080)来查看摄像头的实时视频流。 2. 导入OpenCV 在Python中,你需要导入OpenCV库来处理视频流和图像: ``` import cv2 ``` 3. 检测人形 以下是一个简单的示例代码,用于从mjpg-streamer视频流中检测人形: ``` import cv2 cap = cv2.VideoCapture('http://localhost:8080/?action=stream') while True: ret, frame = cap.read() if not ret: break gray = cv2.cvtColor(frame, cv2.COLOR_BGR2GRAY) # 使用OpenCV的人形分类器进行检测 face_cascade = cv2.CascadeClassifier('haarcascade_frontalface_default.xml') faces = face_cascade.detectMultiScale(gray, scaleFactor=1.5, minNeighbors=5) # 在图像上绘制检测到的人形 for (x, y, w, h) in faces: cv2.rectangle(frame, (x, y), (x+w, y+h), (0, 255, 0), 2) cv2.imshow('frame', frame) if cv2.waitKey(1) == ord('q'): break cap.release() cv2.destroyAllWindows() ``` 在这个示例中,我们从mjpg-streamer视频流中读取每一帧,并将其转换为灰度图像。然后,我们使用OpenCV的人形分类器来检测人形,然后在图像上绘制矩形来标识检测到的人形。最后,我们在窗口中显示标记的图像。 请注意,这只是一个简单的示例,你可以根据自己的需求进行自定义。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值