前期内容提要:
- 【树莓派-网络监控(1)分析准备】基于树莓派搭建可视化可远程遥控网络监控——工程分析及前期准备
- 【树莓派-网络监控(2)画面传输】基于mjpg-stream实现监控画面的传输
- 【树莓派-网络监控(3)角度遥控】基于python3控制两自由度舵机,实现摄像头拍摄角度的遥控
- 【树莓派-网络监控(4)数据交互】基于python异步io框架Tornado,实现监控遥控命令与Web网页触发事件的绑定及前后端的数据交互
- 【树莓派-网络监控(5)前端搭建】基于iframe标签,集成监控实时画面与遥控功能,完成网络监控的搭建与调试
在前面章节中,我们实现了数据的前后端交互,完成了局域网环境下网络摄像头的搭建与调试工作。但仅仅一个支持局域网内访问的“网络”摄像头,远远不足以成为一个真正意义上的网络
摄像头,也没有达到工程实用性之目的,作为该系列的完结篇,我们将利用内网穿透技术,实现监控的公网远程访问与遥控,打造一个真正意义上的网络摄像头,为工程画上一个圆满的句号。
基本思路:
选用Frp对内网监控进行穿透,穿透对象分别为监控的控制页面
(穿透后地址:[web])以及控制页面中iframe标签内的摄像头实时监控画面
(穿透后地址:[web2]),这两者是需要分别操作的,在穿透过程中不可混为一谈。最后将index.html
文件中iframe标签内的链接更改为 [web2],通过访问 [web] 实现网络监控的外网访问。
一、Frp配置
关于Frp原理及其更多使用方法、应用场景,详见博主专栏: 点此前往
Frps:
sudo apt-get update
wget https://github.com/fatedier/frp/releases/download/v0.17.0/frp_0.17.0_linux_amd64.tar.gz
tar -zxvf frp_0.17.0_linux_amd64.tar.gz
cd frp_0.17.0_linux_amd64
sudo vim ./frps.ini
添加以下内容:
[common]
bind_addr = 0.0.0.0
bind_port = 7000
vhost_http_port = 8080
#放行端口
iptables -I INPUT -i eth0 -p tcp --dport 7000 -j ACCEPT
iptables -I OUTPUT -o eth0 -p tcp --sport 7000 -j ACCEPT
iptables -I INPUT -i eth0 -p tcp --dport 8080 -j ACCEPT
iptables -I OUTPUT -o eth0 -p tcp --sport 8080 -j ACCEPT
#后台保持启动 需要在frp_0.17.0_linux_amd64目录下操作
nohup ./frps -c ./frps.ini &
Frpc:
sudo apt-get update
wget https://github.com/fatedier/frp/releases/download/v0.17.0/frp_0.17.0_linux_arm.tar.gz
tar -zxvf frp_0.17.0_linux_arm.tar.gz
cd frp_0.17.0_linux_arm
sudo vim ./frpc.ini
[web]穿透控制台,[web2]穿透监控画面,[ssh]作为可选项,用于发生穿透故障时检测连接是否畅通(remote_port也需要在服务器端放行)。
[common]
server_addr = your_server_ip
server_port = 7000
[web]
type = http
local_ip = 127.0.0.1
local_port = 80
custom_domains = p.***.com
[web2]
type = http
local_ip = 127.0.0.1
local_port = 8080
custom_domains = c.***.com
[ssh]
type = tcp
local_ip = 127.0.0.1
local_port = 21
remote_port =6000
# 在frp_0.17.0_linux_arm目录下,测试:
./frpc -c ./frpc.ini
二、index.html配置
将index.html
文件中iframe标签内的局域网监控画面链接更改为穿透后的链接。c.***.com
<style type="text/css">
.warpper { overflow-x: auto;overflow-y:hidden; -webkit-overflow-scrolling: touch; width: 100%; height: 300px; margin: 2px auto; border: 0.1px solid black; }
</style>
<div class="warpper">
<iframe src="http://c.***.com:8080/stream_simple.html" style="height:500px;width:100%;" scrolling="yes" frameborder="0"></iframe>
</div>
由于测试环境仅50M带宽,故在用穿透地址替换iframe标签内网监控画面链接的同时,将iframe外的div大小由原来的width: 100%; height: 505px
变更为了width: 100%; height: 300px
以保证内网穿透环境下远程访问画面传输的连续性与稳定性(与之配套也需要调整mjpg-stream参数,详细操作方法 点此查看)。(最终大小可以根据家庭实际网络情况测试后确定)
三、域名解析
四、访问测试
(1) 将内网穿透服务设置为开机自动启动
在全部工程中,一共有三处(摄像头
、监控控制页面
以及内网穿透
)涉及开机自启的设置,为保证后期维护的便捷性,统一选用systemctl方法,实现需求。
sudo vim /etc/systemd/system/frpc.service
[Unit]
Description=frpc daemon
After=syslog.target network.target
Wants=network.target
[Service]
Type=simple
ExecStart=/home/pi/frp_0.17.0_linux_arm/frpc -c /home/pi/frp_0.17.0_linux_arm/frpc.ini
Restart= always
RestartSec=1min
[Install]
WantedBy=multi-user.target
#启动frpc
su
systemctl daemon-reload
systemctl start frpc
#查看是否成功开启
systemctl status frpc.service
#设置为开机启动
systemctl enable frpc
(2)外网环境下可以通过访问 http://p.***.com:8080
的方式登陆网络监控
工程需求 | 工期 | 完成情况(达成\未达成) |
---|---|---|
基于树莓派搭建可视化可远程遥控网络监控 | 六章节 | 达成 |
#工程后期维护、故障测试常用命令:
#摄像头:
cd /home/pi/mjpg-streamer-master/mjpg-streamer-experimental/
./mjpg_streamer -i "./input_uvc.so" -o "./output_http.so -w ./www"
nohup ./mjpg_streamer -i "./input_uvc.so" -o "./output_http.so -w ./www" &
#内网穿透
cd frp_0.17.0_linux_arm/
nohup ./frpc -c ./frpc.ini &
#控制页面
cd 111/
nohup sudo python3 index.py &
至此,我们通过内网穿透技术,实现了树莓派监控的公网远程访问与遥控,完成了公网环境下网络摄像头的全部搭建与部署工作。真正意义上打造了一台完全属于自己控制的网络监控,达到了工程的预期目标和效果!
举一反三:拓展开发示例——打造一个远程可视化空调遥控器:
基本思路:
通过加装红外管,或者直接外接红外编程模块,“克隆”空调遥控器发射出的红外信号,在需要时依样画葫芦地把这个信号发射出去,实现空调的远程启动。
如果您有任何疑问或者好的建议,期待你的留言与评论!