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

opencv经过webcam能够获取本地实时视频流,可是若是须要将视频流共享给其余机器调用,就能够将利用flask框架构建一个实时视频流服务器,而后其余机器能够经过向这个服务器发送请求来获取这台机器上的实时视频流。[这篇文章](https://blog.miguelgrinberg.com/post/video-streaming-with-flask)包含很是详细的理论介绍和具体实现,力荐!html

首先须要说明的是这里flask提供视频流是经过generator函数进行的,不了解的能够去查下文档这里就不具体讲了。flask经过将一连串独立的jpeg图片输出来实现视频流,这种方法叫作motion JPEG,好处是延迟很低,可是成像质量通常,由于jpeg压缩图片的质量对motion stream不太够用。python

multipart 模式

想要将后一次请求获得的图片覆盖到前一次从而达到动画的效果就须要使用在response的时候使用multipart模式。Multipart response由如下几部分组成:包含multipart content类型的header,分界符号分隔的各个part,每一个part都具备特定的content类型。multipart视频流的结构以下:git

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>
...

flask server

具体实现代码main.pygithub

from flask import Flask, render_template, Response
import opencv

class VideoCamera(object):
    def __init__(self):
        # 经过opencv获取实时视频流
        self.video = cv2.VideoCapture(0) 
    
    def __del__(self):
        self.video.release()
    
    def get_frame(self):
        success, image = self.video.read()
        # 由于opencv读取的图片并不是jpeg格式,所以要用motion JPEG模式须要先将图片转码成jpg格式图片
        ret, jpeg = cv2.imencode('.jpg', image)
        return jpeg.tobytes()

app = Flask(__name__)

@app.route('/')  # 主页
def index():
    # jinja2模板,具体格式保存在index.html文件中
    return render_template('index.html')

def gen(camera):
    while True:
        frame = camera.get_frame()
        # 使用generator函数输出视频流, 每次请求输出的content类型是image/jpeg
        yield (b'--frame\r\n'
               b'Content-Type: image/jpeg\r\n\r\n' + frame + b'\r\n\r\n')

@app.route('/video_feed')  # 这个地址返回视频流响应
def video_feed():
    return Response(gen(VideoCamera()),
                    mimetype='multipart/x-mixed-replace; boundary=frame')   

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

index.htmlweb

<html>
  <head>
    <title>Video Streaming Demonstration</title>
  </head>
  <body>
    <h1>Video Streaming Demonstration</h1>
    <img src="{{ url_for('video_feed') }}">
  </body>
</html>

注:图片地址由大括号内的字典给出,指向app的第二个地址video_feed,在multipart模式下浏览器会将每次请求获得的地址对大括号进行更新。flask

局限性

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

参考

https://blog.miguelgrinberg.com/post/video-streaming-with-flask
https://github.com/mattmakai/video-service-flask
http://www.chioka.in/python-live-video-streaming-example/服务器

相关文章
相关标签/搜索