当前位置：首页 > backend >正文

树莓派网页监控

backend 2025/9/3 10:40:09

#!/usr/bin/env python3
# -*- coding: utf-8 -*-
"""
极简 Flask：网页内直接嵌入 MJPEG 视频流（不需要 VNC 窗口）
- 通过 libcamera-vid 输出 MJPEG 到 stdout，再由 Flask 包成 multipart/x-mixed-replace
- 两路接口：/cam/0/mjpeg 与 /cam/1/mjpeg
- 主页内嵌 <img src=...> 连续刷新即可看到实时画面依赖：sudo apt-get updatesudo apt-get install -y python3-flask libcamera-apps运行：sudo python3 app.py --host 0.0.0.0 --port 8000浏览器打开 http://<Pi-IP>:8000/注意：
- 每个浏览器连接会各自启动一个 libcamera-vid 子进程，断开连接即结束。
- 如果提示相机被占用，请先关闭其它正在使用相机的进程（包含你开的 libcamera-hello 窗口）。
"""import os
import sys
import subprocess
from flask import Flask, Response, render_template_stringapp = Flask(__name__)INDEX_HTML = """
<!doctype html>
<html lang="zh">
<head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1" /><title>Pi 双摄网页预览（MJPEG）</title><style>body{font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;margin:16px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}.card{border:1px solid #e5e7eb;border-radius:12px;padding:12px;box-shadow:0 1px 2px rgba(0,0,0,.04)}img{width:100%;height:auto;border-radius:8px;background:#000}small{color:#6b7280}</style>
</head>
<body><h1>Pi 双摄网页预览（MJPEG）</h1><div class="grid"><div class="card"><h3>Camera 0</h3><img src="/cam/0/mjpeg" alt="Camera 0"/><small>源：libcamera-vid --camera 0 --codec mjpeg -t 0 -o -</small></div><div class="card"><h3>Camera 1</h3><img src="/cam/1/mjpeg" alt="Camera 1"/><small>源：libcamera-vid --camera 1 --codec mjpeg -t 0 -o -</small></div></div>
</body>
</html>
"""def _mjpeg_stream(camera_index: int, width: int = 1280, height: int = 720):"""启动 libcamera-vid 输出 MJPEG 到 stdout，并逐帧切片为 multipart 片段。"""cmd = ["libcamera-vid","--camera", str(camera_index),"--codec", "mjpeg","--width", str(width),"--height", str(height),"-t", "0",            # 无限时长"-o", "-",            # 输出到 stdout"--nopreview",         # 不启用本地预览窗口]# 启动子进程proc = subprocess.Popen(cmd, stdout=subprocess.PIPE, stderr=subprocess.PIPE, bufsize=0)boundary = b"--FRAME"buffer = bytearray()SOI = b"\xff\xd8"  # JPEG Start Of ImageEOI = b"\xff\xd9"  # JPEG End Of Imagetry:# 持续读取 stdout，按 SOI/EOI 切出完整 JPEG 帧while True:chunk = proc.stdout.read(4096)if not chunk:breakbuffer.extend(chunk)# 可能会一次到多帧；循环切片while True:soi = buffer.find(SOI)if soi < 0:# 丢弃 SOI 之前的无效数据if len(buffer) > 1024:del buffer[:-2]breakeoi = buffer.find(EOI, soi + 2)if eoi < 0:# 帧未结束，继续读break# 取出完整 JPEG 帧（包含 EOI 0xFFD9）frame = bytes(buffer[soi:eoi + 2])del buffer[:eoi + 2]# 发送 multipart 片段headers = (boundary + b"\r\n" +b"Content-Type: image/jpeg\r\n" +b"Content-Length: " + str(len(frame)).encode() + b"\r\n\r\n")yield headers + frame + b"\r\n"finally:# 断开或异常时，确保子进程退出try:proc.terminate()except Exception:pass@app.route("/")
def index():return render_template_string(INDEX_HTML)@app.route("/cam/<int:cam>/mjpeg")
def stream(cam: int):# 这里可按需改分辨率，如 1640x1232 以适配 IMX219 方便return Response(_mjpeg_stream(cam, width=1280, height=720),mimetype='multipart/x-mixed-replace; boundary=FRAME')if __name__ == '__main__':host = os.environ.get('HOST', '0.0.0.0')port = int(os.environ.get('PORT', '8000'))print(f"Serving on http://{host}:{port}")app.run(host=host, port=port, threaded=True, debug=False)