WeChat applet realizes real-time video surveillance [based on Raspberry Pi 4b+]

Required tools: a cloud server with public network ip, raspberry pie, cis camera, nginx server, mjpg-stream plug-in

1. Build nginx server
Raspberry Pi and cloud server must be installed

sudo apt-get install nginx

2. Raspberry Pi configuration to enable csi service
Refer to blog: link
Open Raspberry Pi terminal

sudo raspi-config  #调出树莓派配置控制台

Follow the steps to turn on your csi camera

to test whether the Raspberry Pi camera can be used normally

raspistill -v -o test.jpg   #拍摄一张图片 至于raspistill的传输可以使用help查看

There may be a port conflict problem here. The default port is 8080. If you can’t open it, you can check the port number.

 pip install whatportis  #安装端口号查看工具
  whatportis ssh  #查看某个服务使用的端口号
 # 也可以
 netstat -an |grep 8080#查看8080端口使用情况
 #然后kill掉占用的端口号再开启我们的服务避免端口冲突

3. Configure mjpg-stream service
Reference: Reference Blog

Understanding:
mjpg-streamer is used to collect images from webcam cameras, and transmit them to browsers in the form of streams through ip-based networks, such as Firefox, Cambozola and VLC players. It can take advantage of some webcam hardware compression features to reduce server CPU overhead. Provides a lightweight and less CPU-intensive solution for embedded devices and some conventional servers. (Translation Wikipedia) In its source code, it mainly revolves around the 4l2 interface of linuxv (note that the v4l2 interface does not exist in the low-version kernel and therefore cannot be used), socket network programming, and multi-threaded programming. It also contains important plug-ins input-plugins and output-plugins.
Mjpg‐streamer is an open source software for capturing images from a webcam, which copies JPEG frames from one or more input plugins to multiple output plugins. It can be used to stream JPEG files from webcams over IP-based networks to various types of viewers such as Chrome, Firefox, Cambozola, VLC, mplayer and other software capable of receiving MJPG streams

Raspberry Pi on
Raspberry Pi Learning Resources: Raspberry Pi Lab
Installation and Compilation

Official Website: http://sourceforge.net/projects/mjpg-streamer/

$ sudo apt-get install libjpeg-dev subversion imagemagick
$ cd ~/mjpg-streamer-master/mjpg-streamer-experimental
$ make
$ sudo make install

test:

 mjpg_streamer  -i "input_uvc.so -n -f 10 -r 640x480  -d /dev/video0" -o "output_http.so -p 8080  -w /usr/local/share/mjpg-streamer/www"

Modify the configuration file start.sh file

run:

./start.sh

Of course, the port number conflict problem is excluded, because the port number used by the web is 8080. Here we can open the mjpg-stream configuration file start.sh to configure a new port number to avoid port conflicts. 4. Use the mjpg-stream service to connect the Raspberry
Pi The real-time image of the camera can be viewed on the web page

http://localhost:8080/stream.html
http://<devIP>:8080/stream.html
http://<树莓派IP地址>:8080/javascript.html

Choose one and open it in the browser to see the real-time picture.
Here we will find the open web video super card, which is the result of not configuring mjpg-stream, you can configure the number of frames read per second.
In the case of real-time monitoring that cannot be turned on here, it is generally because we have not turned on motion. Here we can configure motion again to support hot swapping of cameras.

5. Use the nginx service to reverse proxy the Raspberry Pi intranet IP to the public network server [this step is optional]

6. Use frp technology to convert the Raspberry Pi intranet camera server into a web service
frp official website learning: link
Raspberry Pi side configuration
/etc/nginx/conf.d configuration file to create frpc.conf file

server{
    
    
listen 8080;#服务器使用的端口
server_name localhost #这里一般填写域名,当然也可以是公网ip
location /{
    
    
	proxy_pass http://localhost:8181;#将内网服务转接成端口8181的web服务
}
}

frpc.ini file code

[common]
server_addr = x.x.x.x #公网ip
server_port = 7000#和frps服务端相连的端口,需要和服务端那边绑定的端口一致
[web]
type =http
local_port =8181 #内网机器开放的服务端口
custom_domains =x.x.x.x #这里最好是域名,公网ip也可以

Server-side configuration
Create a frps.conf

server{
    
    
listen 8080;#服务器使用的端口
server_name x.x.x.x #公网ip
location / {
    
    
client_max_body_size 1000m;
#假设frps端口8080
proxy_pass http://127.0.0.1:8181;#内网开发的端口
proxy_redirect off;#重定向关闭
proxy_set_heard X-Real-IP $remote_addr;
proxy_set_heard X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_heard Host $http_host;
proxy_set_heard X-NginX-Proxy true;
}
}

frps. ini

[common]
bind_port =7000;#frps和frpc相连端口
vhost_http_port = 8181 #vhost_http_port 用于接收http请求

7. Start the frp of the client and server to realize the service built by the public network ip to access the intranet

./frps -c ./frps/ini #启动服务端
./frpc -c ./frpc.ini #启动客户端
#如果需要长期使用要结合其他工具,比如systemd和supervisor

8. The port @ TOC required for the opening of the cloud server
is not written in detail here. You can search it directly on the Internet.
Of course, you can also refer to this article: Portal

9. Get real-time video from WeChat Mini Program

<view class="bj">
    <view class="container">
        <text class="bt">实时视频监控</text>
        <image class="photo" src="http://云服务器地址:使用的端口/?action=stream" mode="aspectFit"></image>
    </view>
</view>

Resource: Android app realizes video streaming: https://github.com/tancolin/App4Mjpg-streamer.git

Guess you like

Origin blog.csdn.net/weixin_43673603/article/details/124604863