Flask / Python-如何使用来自多个IP摄像机的实时镜头填充HTML页面?

山姆

我有一组摄像机,每个摄像机都有RTSP格式的URL。我创建了一个小脚本来解析来自camera_config JSON文件的摄像机URL,但是现在我不确定如何将视频嵌入HTML页面的网格布局中。我写的脚本:

import json
from flask import flask


data = request.get_json()
file = open('cam_config.json',)
data = json.load(file)
for i in data['camStreams']:
    i = data['camUrl']

    

@app.route("/livecams")
def livecams():
    return render_template("live_cams.html", camUrl = i)

JSON档案:

{
  "camDataDir":"/e/camData",
  "playback": {
    "playbackSpeed":"16.0"
  },
  "camStreams": [
    {
      "camName":"driveway",
      "camUrl":"rtsp://admin:[email protected]:554/Streaming/Channels/3",
      "camUrl4k":"rtsp://admin:[email protected]:554/Streaming/Channels/1",
      "camUrl720p":"rtsp://admin:[email protected]:554/Streaming/Channels/3",
      "camUrlMjpeg":"http://admin:[email protected]/ISAPI/Streaming/channels/102/httpPreview"
      }
    },
    {
      "camName": "backyard",
      "camUrl": "rtsp://admin:[email protected]/cam/realmonitor?channel=1&subtype=02",
      "camUrl4k": "rtsp://admin:[email protected]/cam/realmonitor?channel=1&subtype=01",
      "camUrl720p": "rtsp://admin:[email protected]/cam/realmonitor?channel=1&subtype=02",
      "camUrlMjpeg": "http://admin:[email protected]/cgi-bin/mjpg/video.cgi?channel=0&subtype=1"
      }
    }
  ]
}

HTML页面(不完整)

{% extends "layout.html" %}

{% block content %}
  <h1>Live Cams</h1>
  <div class="grid"
  <div class="container mt-3 mb-3">
    <img src="{{ camUrl }}" alt="Cam 1" width="640" height="360">
  </div>


{% endblock content %}

{% block script %}

{% endblock script %}

live_cams.html是实时摄像机录像的页面。我将如何修改它以读取每个URL并以网格形式输出到HTML页面上?实际上,我必须对HTML文件中的每个摄像机进行硬编码,但是我希望它在调用HTML文件时自动填充。目的是简单地使用其他摄像机更新cam_config并使其动态更新。

感谢任何可以提供帮助的人。烧瓶对我来说是新的。

djnz

您可以将cam数据直接传递到您的计算机中,render_template并使用jinja for循环为您的对象中的每个对象输出一个容器(或您想要的任何容器)camStreams,例如:

您的看法:

@app.route("/livecams")
def livecams():
    # Having this in the view means it will reload the config with each page refresh
    file = open('cam_config.json',)
    data = json.load(file)

    return render_template("live_cams.html", cameras=data)

在您的html中:

{% for camera in cameras %}
<div class="container mt-3 mb-3">
  <img src="{{ camera.camUrl }}" alt="{{camera.camName}}" width="640" height="360">
</div>
{% endfor %}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章