yolo摄像头检测结果web界面视频实时播放展示(使用flask实现)


话不多说,先上效果。摄像头为博主手持的…
请添加图片描述

实现方案如下,欢迎评论区交流,希望有更好的方案。

前端界面代码

<!DOCTYPE html>
<html>
  <head>
    <title>视频</title>
  </head>
  <body>
    <h1>视频</h1>
    <img src="{{ url_for('video_feed') }}">
  </body>
</html>

检测代码

生成视频帧的函数generate_frames()不断地迭代产生视频帧数据。

具体来说,generate_frames()函数使用cv2.VideoCapture打开本地摄像头,然后进入一个无限循环。在每次循环中,它调用cap.read()读取摄像头的视频帧,然后调用process_frame()方法对该帧进行yolo的目标检测。

关键在于使用yield语句将每个处理后的帧数据输出为一个视频帧。这意味着在每次迭代时,生成器都会生成一个视频帧,并通过HTTP响应流发送给客户端。生成器会继续循环,读取下一帧并进行处理,然后再次通过yield语句生成下一个视频帧。

这样,当客户端请求视频流时,Response对象会使用generate_frames()生成器返回的视频帧数据作为响应内容,并设置相应的HTTP头部以指定数据类型和边界。

import cv2
from flask import Flask, render_template, Response
from ultralytics import YOLO
app = Flask(__name__)
model = YOLO("yolov8n.pt")
def process_frame(frame):
    # 在这里对视频帧进行处理
    # 这里只是一个示例,你可以根据需要自定义处理逻辑
    # 例如这里就返回yolo检测的结果
    # gray = cv2.cvtColor(frame, cv2.COLOR_BGR2GRAY)
    res = model(frame)  # predict on an image
    res_plotted = res[0].plot()
    return res_plotted

def generate_frames():
    cap = cv2.VideoCapture(0)

    while True:
        ret, frame = cap.read()

        if not ret:
            break

        processed_frame = process_frame(frame)

        # 将处理后的帧转换为JPEG格式
        ret, buffer = cv2.imencode('.jpg', processed_frame)
        frame_data = buffer.tobytes()

        # 使用生成器生成视频帧
        yield (b'--frame\r\n'
               b'Content-Type: image/jpeg\r\n\r\n' + frame_data + b'\r\n')

@app.route('/')
def index():
    return render_template('index.html')

@app.route('/video_feed')
def video_feed():
    return Response(generate_frames(),
                    mimetype='multipart/x-mixed-replace; boundary=frame')

if __name__ == '__main__':
    app.run(debug=True)
  • 2
    点赞
  • 42
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
YOLOv4是最近推出的基于深度学习的实时目标检测方法。利用YOLOv4训练完自己的数据集后,如何向大众展示并提供落地的服务呢?  本课程将提供相应的解决方案,具体讲述使用Web应用程序框架Flask进行YOLOv4的Web应用部署。用户可通过客户浏览器上传图片,经服务器处理后返回图片检测数据并在浏览器中绘制检测结果。  本课程的YOLOv4使用AlexyAB/darknet,在Ubuntu系统上做项目演示,并提供在Windows系统上的部署方式文档。 本项目采取前后分离的系统架构和开发方式,减少前后的耦合。课程包括:YOLOv4的Flask部署系统架构、YOLOv4的安装及动态链接库的编译、 Flask的安装、YOLOv4的检测API接口python代码、 Flask的服务程序的python代码、前端html代码、CSS代码、Javascript代码、系统部署演示、生产环境部署建议、Windows系统上部署的区别等。 除本课程外,本人推出了有关YOLOv4目标检测的系列课程。请持续关注该系列的其它视频课程,包括: 《YOLOv4目标检测实战:训练自己的数据集》(Ubuntu版) 《YOLOv4目标检测实战:人脸口罩佩戴识别》(Ubuntu版) 《YOLOv4目标检测实战:中国交通标志识别》(Ubuntu版) 《YOLOv4目标检测:原理与源码解析》(Ubuntu版) 《YOLOv4-tiny目标检测实战:训练自己的数据集》(Ubuntu版) 《Windows版YOLOv4目标检测实战:训练自己的数据集》 《Windows版YOLOv4目标检测实战:人脸口罩佩戴识别》 《Windows版YOLOv4目标检测实战:中国交通标志识别》 《Windows版YOLOv4目标检测:原理与源码解析》 《Windows版YOLOv4-tiny目标检测实战:训练自己的数据集》

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值