Python中如何利用Flask将OpenCV实时视频流输出到浏览器

利用 flask 将 opencv 实时视频流输出到浏览器

  • opencv 通过 webcam 可以获取本地实时视频流，但是如果需要将视频流共享给其他机器调用，就可以将利用 flask 框架构建一个实时视频流服务器，然后其他机器可以通过向这个服务器发送请求来获取这台机器上的实时视频流。

multipart 模式

  • 想要将后一次请求得到的图片覆盖到前一次从而达到动画的效果就需要使用在 response 的时候使用 multipart 模式。Multipart response 由以下几部分组成：包含 multipart content 类型的 header，分界符号分隔的各个 part，每个 part 都具有特定的 content 类型。multipart 视频流的结构如下：
	HTTP/1.1 200 OK
    Content-Type: multipart/x-mixed-replace; boundary=frame

--frame
Content-Type: image/jpeg

<jpeg data here>
--frame
Content-Type: image/jpeg

<jpeg data here>
...

这里解决了一次只能被一台机器查看的局限性

  • 如果视频流一直存在的话，这个 app 能输出视频流的的客户端的数量和 web worker 的数量相同，在 debug 模式下，这个数量是 1，也就是说只有一个浏览器上能够看到视频流输出。如果要克服这种局限的话，使用基于协同网络服务的框架比如 gevent，可以用一个 worker 线程服务多个客户端。
  • 已解决

新增功能

  • 这里增加了登录与退出登录功能
  • 还增加了视频的录制
  • 地址 ： Github 项目地址
  • 如果觉得小弟的项目不错，麻烦给个 star 喽！

Python中如何利用Flask将OpenCV实时视频流输出到浏览器

2 回复

要在Flask中将OpenCV的实时视频流输出到浏览器，核心是使用生成器函数和multipart/x-mixed-replace响应。下面是一个完整的示例：

首先安装必要的库：

pip install flask opencv-python

然后创建app.py：

from flask import Flask, Response
import cv2

app = Flask(__name__)

def generate_frames():
    # 打开摄像头（0通常是默认摄像头）
    camera = cv2.VideoCapture(0)
    
    while True:
        success, frame = camera.read()
        if not success:
            break
        else:
            # 将帧转换为JPEG格式
            ret, buffer = cv2.imencode('.jpg', frame)
            frame = buffer.tobytes()
            
            # 使用生成器逐帧输出
            yield (b'--frame\r\n'
                   b'Content-Type: image/jpeg\r\n\r\n' + frame + b'\r\n')

@app.route('/video_feed')
def video_feed():
    # 返回multipart响应，实现视频流
    return Response(generate_frames(),
                    mimetype='multipart/x-mixed-replace; boundary=frame')

@app.route('/')
def index():
    # 简单的HTML页面显示视频流
    return '''
    <html>
      <head>
        <title>实时视频流</title>
      </head>
      <body>
        <h1>实时视频流</h1>
        <img src="/video_feed" width="640" height="480">
      </body>
    </html>
    '''

if __name__ == '__main__':
    app.run(host='0.0.0.0', port=5000, debug=True)

这个方案的关键点：

  1. generate_frames()函数作为生成器，持续从摄像头捕获帧
  2. 使用cv2.imencode()将OpenCV的BGR格式转换为JPEG字节流
  3. Response对象设置multipart/x-mixed-replace MIME类型，允许浏览器持续更新图像
  4. HTML页面通过<img src="/video_feed">标签显示视频流

运行后访问http://localhost:5000就能看到实时视频。如果需要处理多个摄像头或添加视频处理，可以在generate_frames()函数中修改。

总结：用生成器配合multipart响应就能搞定实时流。


顶帖

回到顶部