[分享] 【树莓派3B+测评】搭建Flask视频流媒体Web服务器

DDZZ669   2018-10-3 17:12 楼主
上个帖子【树莓派3B+测评】TensorFlow物体识别对tensorflow深度学习框架进行了简单的使用,这次尝试通过Flask搭建视频流媒体Web服务器。 先看一下最终的效果1.jpg 将树莓派的USB摄像头采集到的图像实时显示在浏览器界面上,视频流的传输用到的是Flask,网页界面通过html编程实现。 首先安装Flask
  1. sudo pip install flask
我的树莓派系统已经自带有这个软件包了。 接下来需要新建一个文件夹来存放整个项目文件。我在桌面的test文件夹中新建了一个flask-video文件夹,并且需要在该文件夹中新建static和templates文件夹(这两个文件夹用于存放网页设计相关文件)。另外需要python程序进行摄像头的读取,视频流的传输。 整个项目的结构如下2.png app.py代码如下,主要是通过flask实现视频流传输。 程序中端口666是随意设置的。
  1. from flask import Flask, render_template, Response
  2. from camera_opencv import Camera
  3. app = Flask(__name__)
  4. @app.route('/')
  5. def index():
  6. """Video streaming home page."""
  7. return render_template('index.html')
  8. def gen(camera):
  9. """Video streaming generator function."""
  10. while True:
  11. frame = camera.get_frame()
  12. yield (b'--frame\r\n'
  13. b'Content-Type: image/jpeg\r\n\r\n' + frame + b'\r\n')
  14. @app.route('/video_feed')
  15. def video_feed():
  16. """Video streaming route. Put this in the src attribute of an img tag."""
  17. return Response(gen(Camera()),
  18. mimetype='multipart/x-mixed-replace; boundary=frame')
  19. if __name__ == '__main__':
  20. app.run(host='0.0.0.0', port =666, debug=True,threaded=True)
base_camera.py 多线程视频传输(详见github附件) camera_opencv.py 用于获取USB摄像头图像
  1. import cv2
  2. from base_camera import BaseCamera
  3. class Camera(BaseCamera):
  4. video_source = 0
  5. @staticmethod
  6. def set_video_source(source):
  7. Camera.video_source = source
  8. @staticmethod
  9. def frames():
  10. camera = cv2.VideoCapture(Camera.video_source)
  11. if not camera.isOpened():
  12. raise RuntimeError('Could not start camera.')
  13. while True:
  14. # read current frame
  15. _, img = camera.read()
  16. # encode as a jpeg image and return it
  17. yield cv2.imencode('.jpg', img)[1].tobytes()
接下来是html相关文件 index.html内容如下,body中的内容是网页中显示的内容,本例程显示了视频窗口和一个树莓派图标。
引用: Video Streaming Demonstration

视频流媒体Demo


@2018 Raspberry Pi 3B+

style.css内容如下,它是index.html的配置文件,用于设置网页的颜色、字体等。
  1. body{
  2. background: #D2E9FF;
  3. color: #FF8040;
  4. padding:1%;
  5. text-align: center;
  6. }
整个项目的代码我上传到了github,地址:flask-video-streaming-usbcamera 程序运行命令为:
  1. python2 app.py
然后在浏览器的地址栏中输入
  1. http://localhost:666
即可启动。 演示视频:树莓派视频流媒体Demo 本帖最后由 DDZZ669 于 2018-10-3 20:07 编辑

回复评论 (1)

VNC登录如果没有调整树莓派的分辨率,可能会出现下面的结果,屏幕分辨率太小了!
3.jpg
调整屏幕分辨率的方法很简单,在终端中输入:
  1. sudo raspi-config

会出现如下界面,通过上下键选择Advanced Options
4.png

然后选择Resolution,选择一个合适的分辨率,保存,重启树莓派即可。
5.png


点赞  2018-10-3 21:20
电子工程世界版权所有 京B2-20211791 京ICP备10001474号-1 京公网安备 11010802033920号
    写回复