利用flask将opencv实时视频流输出到浏览器
opencv通过webcam可以获取本地实时视频流,但是如果需要将视频流共享给其他机器调用,就可以将利用flask框架构建一个实时视频流服务器,然后其他机器可以通过向这个服务器发送请求来获取这台机器上的实时视频流。[这篇文章](https://blog.miguelgrinberg.com/post/video-streaming-with-flask)包含非常详细的理论介绍和具体实现,力荐!
首先需要说明的是这里flask提供视频流是通过generator函数进行的,不了解的可以去查下文档这里就不具体讲了。flask通过将一连串独立的jpeg图片输出来实现视频流,这种方法叫做motion JPEG,好处是延迟很低,但是成像质量一般,因为jpeg压缩图片的质量对motion stream不太够用。
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>
...
flask server
具体实现代码:main.py
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.html
<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模式下浏览器会将每次请求得到的地址对大括号进行更新。
局限性
如果视频流一直存在的话,这个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/
利用flask将opencv实时视频流输出到浏览器的更多相关文章
- opencv获取IP摄像头(IP-camera)实时视频流
之前这篇文章讲了如何通过网络摄像头(web camera)获取实时视频流,但是这种方法的缺陷就是摄像头和主机必须连在一起,那这种在室外部署的时候就会非常麻烦并且不安全,所以后来找了下用海康威视或者大华 ...
- 人脸检测及识别python实现系列(6)——终篇:从实时视频流识别出“我”
人脸检测及识别python实现系列(6)——终篇:从实时视频流识别出“我” 终于到了最后一步,激动时刻就要来临了,先平复一下心情,把剩下的代码加上,首先是为Model类增加一个预测函数: #识别人脸 ...
- 人脸检测及识别python实现系列(1)——配置、获取实时视频流
人脸检测及识别python实现系列(1)——配置.获取实时视频流 1. 前言 今天用多半天的时间把QQ空间里的几篇年前的旧文搬到了这里,算是完成了博客搬家.QQ空间里还剩下一些记录自己数学学习路线的学 ...
- 在WEB显示实时视频流
转载自:https://www.jianshu.com/p/7ef5490fbef7 安装摄像头 这里使用的是树莓派的官方摄像头,使用普通的 USB 摄像头也可以,但前提是你能够搞的定它的驱动. 大概 ...
- 利用javascript实现文本的自动输出
主要利用了setTimeout(),递归和String.substring(); 做出的效果就像是有一个打字员在打字. <!doctype html> <html lang=&quo ...
- opencv学习_15 (利用cmake查看opencv的源码)
当我们有时想查看opencv自带的函数的源代码,比如函数cvCreateImage, 此时我们选中cvCreateImage, 点击鼠标右键->转到定义,我们会很惊讶的发现为什么只看到了cvCr ...
- 利用sql命令把结果集输出到文件
利用sql命令把结果集输出到文件 红色部分的三条命令完成把结果集输出到文件!! [root@test root]# psql -hlocalhost -Utest testWelcome to psq ...
- Python - 利用flask搭建一个共享服务器
零.概述 我利用flask搭建了一个简易的共享服务器,分享给大家 一.python代码 import os import time from flask import Flask,render_tem ...
- 利用cmake查看opencv的源码
当我们有时想查看opencv自带的函数的源代码,比如函数cvCreateImage, 此时我们选中cvCreateImage, 点击鼠标右键->转到定义,我们会很惊讶的发现为什么只看到了cvCr ...
随机推荐
- 手写体识别中用到的Tensorflow函数复习
tf.truncated_normal(shape, stddev=0.1) 从截断的正态分布中输出随机值. 生成的值服从具有指定平均值和标准偏差的正态分布,如果生成的值大于平均值2个标准偏差的值则丢 ...
- zookeeper学习:知识点收集
其实学习zookeeper挺简单的,找一本书或者网上的资源,按照其中的例子做一遍就大致了解了.之前是自己学习的方法有问题. 1. 会启动单机版的服务器,并使用客户端连接,然后进行节点的各种操作 2. ...
- C语言 · 最长单词
算法提高 最长单词 时间限制:1.0s 内存限制:512.0MB 编写一个函数,输入一行字符,将此字符串中最长的单词输出. 输入仅一行,多个单词,每个单词间用一个空格隔开.单词仅由小 ...
- Linux shell while
sh count=1 while [ $count -le 5 ]; do echo 1234567890abcdefghqwertyuiopdasdk > /dev/ttyS1 & e ...
- USB入门
简述 USB(Universal Serial Bus)全称通用串口总线,USB为解决即插即用需求而诞生,支持热插拔.USB协议版本有USB1.0.USB1.1.USB2.0.USB3.1等,USB2 ...
- MATLAB — axis
转至:http://blog.csdn.net/cs_zlg/article/details/8516463 axis中文为“轴”之意,在matlab中用于控制坐标轴的范围和样式(颜色等). axis ...
- CSS2.0中最常用的18条技巧
一.使用css缩写 使用缩写可以帮助减少你CSS文件的大小,更加容易阅读. 具体内容请浏览:CSS常用缩写语法 二.明确定义单位,除非值为0. 忘记定义尺寸的单位是CSS新手普遍的错误.在HTML中 ...
- 【转】【WPF】WPF中MeasureOverride ArrangeOverride 的理解
1. Measure Arrange这两个方法是UIElement的方法 MeasureOverride ArrangeOverride这两个方法是FrameworkElement的方法,Framew ...
- win10: This file can't be opened
win10打开bat脚本,不能运行,提示This file can't be opened. 解决方法如下: http://johnklann.com/these-files-cant-be-open ...
- MySQL导入数据错误error: 13 及解决办法
先说解决办法 将sql文件放到你的账号能够访问的地方!!! 因为我用的grid账号,所以只需要将sql放到 ~grid/ 或者 /tmp等grid能够访问的地方即可. Don't place the ...