[Flask + OpenCV]制作实时视频流播放网页

最新推荐文章于 2024-01-25 23:43:29 发布
最新推荐文章于 2024-01-25 23:43:29 发布
阅读量5.8k 收藏 33
点赞数 11
分类专栏： python OpenCV 文章标签： flask
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41979513/article/details/99288128
版权

参考博文： https://blog.miguelgrinberg.com/post/video-streaming-with-flask

新建以下目录

在这里插入图片描述

1、在app中输入以下代码，需要安装opencv
from flask import Flask, render_template, Response
import cv2
 
class VideoCamera(object):
    def __init__(self):
        self.cap = cv2.VideoCapture("rtmp://***************") 
    
    def __del__(self):
        self.cap.release()
    
    def get_frame(self):
        success, image = self.cap.read()
        ret, jpeg = cv2.imencode('.jpg', image)
        return jpeg.tobytes()
 
app = Flask(__name__)
 
@app.route('/') 
def index():
    return render_template('index.html')
 
def gen(camera):
    while True:
        frame = camera.get_frame()
        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', port=5000)
2、在templates文件夹中，新建index.html填写以下内容
<html>
  <head>
    <title>Video Streaming Demonstration</title>
  </head>
  <body>
    <h1>Video Streaming Demonstration</h1>
    <img src="{{ url_for('video_feed') }}">
  </body>
</html>
3、演示效果如下在这里插入图片描述
4、在线部署了YOLO目标检测

在这里插入图片描述

JstuCheng
关注
  • 11
    点赞
  • 踩
  • 33
    收藏
    觉得还不错? 一键收藏
  • 15
    评论
专栏目录
python Flask实现微电影视频网站
07-31
python Flask实现微电影视频网站全套源码加视频教程，Flask是Python高手公认的、好用的轻量级框架，微内核＋各种扩展插件，能让你轻松灵活的应对各种大小项目的开发，这次，在纯实战的生产环境中，给你讲透Flask，让你达到实际工作1.5年以上的水平。
使用Flask+OpenCV实现浏览器/微信小程序的视频流传输
weixin_46064809的博客
03-25 1916
本文介绍了使用Flask和OpenCV实现浏览器和微信小程序之间的视频流传输的方法。首先，介绍了如何使用Flask在Web应用程序中创建视频流。然后如何使用OpenCV捕获视频流并将其转换为图像帧，并将这些图像帧传输到Web应用程序中。接下来介绍了如何使用JavaScript和HTML将视频流嵌入到Web页面中，并使用微信小程序SDK将视频流嵌入到微信小程序中。最后，阐述了一下uni-app和原生微信小程序的一个使用的不同之处。通过本文，读者可以了解如何使用Flask和OpenCV实现视频展示。
使用flask将Yolov5部署到前端页面实现视频检测（保姆级）
m0_74760466的博客
12-01 3299
首先，开发工具我们选择jetbrains公司的Pycharm，打开Pycharm，选择new Project,flask,路径根据自己的自身情况改，最好点击create创建成功！此时，新建好的flask工程目录长这样static文件夹下存放一些文件，比如css，js，images等，templates文件夹存放一些html的文件，便于日后flask部署。app.py文件。
【Python】采用OpenCV和Flask来进行网络图像推流的低延迟高刷FPS方法（项目模板）
网易独家音乐人Mike Zhou的博客
01-25 1153
【Python】采用OpenCV和Flask来进行网络图像推流的低延迟高刷FPS方法（项目模板）
[学习笔记opencv+flask] flask上的在线视频播放
zxone123的博客
03-23 4458
1. 背景今天想把摄像头里的视频实时在网页上显示（约等于web camera， 服务器端）想到的步骤是opencv的摄像头功能，提成图像文件，然后用generator functions这种方法来实时传达可是，当我把opencv的摄像头作为一个全局变量的时候，视频就是一片黑。2. 代码问题代码cap = cv2.VideoCapture(0) def get_frame(): frame ...
利用 flask 将 opencv 实时视频流输出到浏览器--高性能
weixin_42468995的博客
03-04 1862
利用 flask 将 opencv 实时视频流输出到浏览器 解决了所有问题，而且不消耗性能，使用了yield生成器，完美解决性能问题！ 还会继续贡献代码，链接在底部，大哥们如果喜欢记得给个star哦！ opencv 通过 webcam 可以获取本地实时视频流，但是如果需要将视频流共享给其他机器调用，就可以将利用 flask 框架构建一个实时视频流服务器，然后其他机器可以通过向这个服务器发送请求来...
video-cms:使用Python Flask和Bootstrap做的简单视频在线播放网站
05-17
video-cms 使用Python Flask和Bootstrap做的简单视频在线播放网站。 需求 操作系统： Windows或Ubuntu Python： 高于3.5.0 安装方法 下载Python。 对于Windows用户，请访问https://www.python.org/downloads/来下载Python3； 对于Ubuntu用户，Python3已经默认安装在系统中，跳过这一步即可。 安装Flask。 在Windows上打开PowerShell或在Ubuntu上打开Shell， 执行pip install Flask。 安装MySQL插件。 在Windows上打开PowerShell或在Ubuntu上打开Shell，执行pip install PyMySQL来安装基于Python3MySQL插件。 运行程序。 在Windows双击 start.bat，或者 在Ubuntu上执
基于 Python 的 Flask 框架开发的在线电影网站系统（附完整源码）
m0_59596937的博客
05-05 1万+
该项目为基于Python的Flask框架搭建的在线电影网站项目介绍:网站前端采用HTML5编写，使用Bootstrap前端开发框架，后端使用Python3语言编写，以及Flask的Web框架，将MySQL作为数据库，开发工具使用PyCharm后台模块具有对视频、用户、管理员等各类管理功能项目文件:整个movie_project目录运行方法:运行movie_project目录下的manage.py。
flask实现浏览器实时视频播放
SeventhBlue
01-17 7903
参考来源： https://blog.miguelgrinberg.com/post/video-streaming-with-flask https://www.jb51.net/article/63181.htm 工程的所有文件： 想要改成自己获取视频帧并处理的图片，在camera.py文件中修改就可以了。也可以参考最后给出的camera_opencv.py文件和camera_pi...
如何用flask实现网页播放器
weixin_42608318的博客
02-13 254
Flask可以通过在HTML中添加
yolo摄像头检测结果web界面视频实时播放展示(使用flask实现）
qq_37553692的博客
06-02 2674
在每次循环中，它调用cap.read()读取摄像头的视频帧，然后调用process_frame()方法对该帧进行yolo的目标检测。这意味着在每次迭代时，生成器都会生成一个视频帧，并通过HTTP响应流发送给客户端。生成器会继续循环，读取下一帧并进行处理，然后再次通过yield语句生成下一个视频帧。这样，当客户端请求视频流时，Response对象会使用generate_frames()生成器返回的视频帧数据作为响应内容，并设置相应的HTTP头部以指定数据类型和边界。话不多说，先上效果。摄像头为博主手持的…
多摄像机流：使用Flask和OpenCV多摄像机CCTVRTSP视频流
02-05
带有Flask和Open-CV的多个CCTV / RTSP流 pip install -r requirements.txt 运行服务器 app.py 使用笔记本电脑的内置网络摄像头 将零（O）放入cv2.VideoCapture（0） cv2.VideoCapture(0) 使用IP摄像机/ CCTV / RTSP链接 cv2.VideoCapture( ' rtsp://username:password@camera_ip_address:554/user=username_password= ' password ' _channel=channel_number_stream=0.
基于python+flask+opencv+cnn的人脸识别系统-毕业设计源码+使用文档（高分优秀项目）
最新发布
04-14
1、基于CNN模型来实现人脸识别 2、基于Python+Flask将人脸识别模型暴露为web服务形式进行调用 3、基于OpenCV调用摄像头对实时视频流数据进行检测-毕业设计源码+使用文档（高分优秀项目）.zip 该项目是个人高分毕业...
基于Flask+CNN+OpenCV实现人脸识别Python源码+文档说明+数据集+使用说明
01-24
##模块介绍 ###getCameraPics.py:基于摄像头视频流数据获取人脸图片并存储 ###dataHelper.py:原始图像数据的预处理工作，负责将原始图像转化为标准数据文件 # - 不懂运行，下载完可以私聊问，可远程教学 该资源内...
object-detection-flask-opencv:使用Flask和OpenCV进行实时对象检测的Web应用程序
05-04
实时物体检测应用Web应用程序，用于通过Web浏览器对视频流进行实时对象检测。安装创建并激活虚拟环境，如下所示： $ cd cloned/directory/$ python -m venv env$ env/Scripts/activate 安装并激活环境后，请安装所有...
flask-opencv-web-video-steam
11-08
使用flask 和 opencv 创建video stream 并且包含人脸识别分类器，可在视频流中识别人脸
python 获取文件夹(包括子目录)下所有文件的路径
热门推荐
qq_41979513的博客
06-04 2万+
# -*- coding: utf-8 -*- import os def all_files_path(rootDir): //新建空列表用于存储路径 for root, dirs, files in os.walk(rootDir): //分别代表根目录、文件夹、文件 for file in files: //遍历文...
python socket传输文件(视频、图片、文本等）
qq_41979513的博客
06-01 2万+
socket官方文档：https://docs.python.org/2/library/socket.html socket中文详细介绍：http://blog.csdn.net/rebelqsp/article/details/22109925 查看某个端口是否被占用: lsof -i:端口号 客户端 创建套接字对象 s 连接到远程服务器 接受是否连接上的反馈 发送数据 关闭套接字 #!c...
flask+opencv实现网页显示视频图像
05-16
要在 Flask 网页中显示视频图像，可以使用 OpenCV 库来读取视频文件并将其转换为图像帧，然后使用 Flask 的路由和模板渲染功能将图像帧嵌入到 HTML 页面中。 以下是一个简单的示例代码： ```python import cv2 from flask import Flask, render_template, Response app = Flask(__name__) # 读取视频文件 cap = cv2.VideoCapture('video.mp4') # 从视频中读取帧 def gen_frames(): while True: success, frame = cap.read() if not success: break else: # 将帧转换为 PNG 格式 ret, buffer = cv2.imencode('.png', frame) frame = buffer.tobytes() yield (b'--frame\r\n' b'Content-Type: image/png\r\n\r\n' + frame + b'\r\n') # 定义路由，渲染模板 @app.route('/') def index(): return render_template('index.html') # 定义路由，返回图像帧流 @app.route('/video_feed') def video_feed(): return Response(gen_frames(), mimetype='multipart/x-mixed-replace; boundary=frame') if __name__ == '__main__': app.run(debug=True) ``` 在此示例中，我们首先使用 OpenCV 库从视频文件中读取帧，并将每个帧转换为 PNG 格式。然后，我们定义两个 Flask 路由：一个用于渲染 HTML 模板，另一个用于返回图像帧流。最后，我们使用 Flask 的 `Response` 对象将帧流返回给前端页面。 在 HTML 模板中，我们可以使用 `<img>` 标签来显示图像帧。我们将图像帧的 URL 设置为 `/video_feed`，并在 `src` 属性中使用 JavaScript 实时更新图像帧。 ```html <!doctype html> <html> <head> <title>Video Streaming Demonstration</title> </head> <body> <h1>Video Streaming Demonstration</h1> <img src="{{ url_for('video_feed') }}"> </body> </html> ``` 这是一个简单的示例，你可以根据自己的需求进行修改和扩展。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值