树莓派（十三）——使用flask创建视频流媒体服务器
文章目录
- 一、安装FLASK、创建基本的环境
- 二、创建视频流媒体服务器
有好几种方法可以流式传输视频。最好的（也是“更轻松”）方法是使用Miguel Grinberg开发的Flask。有关Flask如何执行此操作的详细说明，请参阅他的精彩教程：flask-video-streaming-revisited。 关于flask更简单的入门，大家可以参考《爱上Raspberry Pi》P176-180.
在这个教程中：Python Web服务器将借助Flask和树莓派。我们要更详细地了解了Flask是如何工作、如何实现Web服务器以及从传感器上捕获数据并在网页上显示其状态。在本教程中的第一部分就是发送到我们前端的数据的视频流。
创建一个Web服务器环境：
首先要做的是在你的树莓派上安装Flask。
一、安装FLASK、创建基本的环境
1、直接pip安装：
sudo pip install flask
2、当我们开始一个新项目时，最好的办法就是创建一个文件夹来保存你的文件。 例如：
回到主页，到你的工作目录：
cd ~
sudo mkdir flask
cd flask
3、新建一个文件夹保存我们的项目：
mkdir camwebserver
按照上面的命令，创建一个名为“camwebserver”的文件夹，将在这里保存我们的python脚本；
4、现在，在这个文件夹/home/pi/flask/camwebserver上，我们将创建两个子文件夹：静态的CSS、最终的JavaScript文件以及HTML文件的模板。 转到你的新创建的文件夹：
cd camwebserver
sudo mkdir static
sudo mkdir templates
5、最终的目录“树”，如下所示：
flask #目录
|__camwebserver #子目录
├── static #子目录
└── templates #子目录
基本环境算是搭建完成了！
接下来我们在创建好的环境下，用Python Web 服务器应用程序来流式传输视频。
二、创建视频流媒体服务器
1、首先，下载Miguel Grinberg的树莓派相机软件包：camera_pi.py，并将其保存在创建的目录camWebServer上。 (https://github.com/Mjrovai/Video-Streaming-with-Flask/blob/master/camWebServer/camera_pi.py)
代码如下：
#!/usr/bin/env python
# -*- coding: utf-8 -*-
#
# camera_pi.py
#
import time
import io
import threading
import picamera
class Camera(object):
thread = None # background thread that reads frames from camera
frame = None # current frame is stored here by background thread
last_access = 0 # time of last client access to the camera
def initialize(self):
if Camera.thread is None:
# start background frame thread
Camera.thread = threading.Thread(target=self._thread)
Camera.thread.start()
# wait until frames start to be available
while self.frame is None:
time.sleep(0)
def get_frame(self):
Camera.last_access = time.time()
self.initialize()
return self.frame
@classmethod
def _thread(cls):
with picamera.PiCamera() as camera:
# camera setup
camera.resolution = (320, 240)
camera.hflip = True
camera.vflip = True
# let camera warm up
camera.start_preview()
time.sleep(2)
stream = io.BytesIO()
for foo in camera.capture_continuous(stream, 'jpeg',
use_video_port=True):
# store frame
stream.seek(0)
cls.frame = stream.read()
# reset stream for next frame
stream.seek(0)
stream.truncate()
# if there hasn't been any clients asking for frames in
# the last 10 seconds stop the thread
if time.time() - cls.last_access > 10:
break
cls.thread = None
这是我们项目的核心，Miguel的安装包相当的不错，大家可以先借鉴，之后再根据自己需求来调整。
2、现在，使用Flask，让我们调整原始的Miguel的web服务器应用程序（camapp.py），创建一个特定的python脚本来渲染我们的视频。我们将其命名为camapp.py:
代码如下：
from flask import Flask, render_template, Response
# Raspberry Pi camera module (requires picamera package, developed by Miguel Grinberg)
from camera_pi import Camera
app = Flask(__name__)
@app.route('/')
def index():
"""Video streaming home page."""
return render_template('index.html')
def gen(camera):
"""Video streaming generator function."""
while True:
frame = camera.get_frame()
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():
"""Video streaming route. Put this in the src attribute of an img tag."""
return Response(gen(Camera()),
mimetype='multipart/x-mixed-replace; boundary=frame')
if __name__ == '__main__':
app.run(host='0.0.0.0', port =8080, debug=True, threaded=True)
3、以上脚本将我们的摄像机视频流式传输到index.html页面上，index.html文件代码如下所示：
<html>
<head>
<title>CFQ's Live Streaming</title>
<link rel="stylesheet" href='../static/style.css'/>
</head>
<body>
<h1>CFQ's Live Streaming</h1>
<h3><img src="{{ url_for('video_feed') }}" width="90%"></h3>
<hr>
<p> @2019/1/2 Developed by CFQ~</p>
</body>
</html>
index.html最重要的一行是：
<img src="{{ url_for('video_feed') }}" width="50%">
视频将会在这里“反馈”到我们的网页上。
4、还必须在静态目录中包含style.css文件，以便以这种形式获得上述结果；
style.css代码如下：
body{
background: blue;
color: yellow;
padding:1%;
text-align: center;
}
5、确保所有的文件都在正确的位置，所有数据更新后，检查一下我们的环境；
使用tree命令可以看到我们的文件目录如下所示：
pi@raspberrypi:~ $ pwd
/home/pi
pi@raspberrypi:~ $ tree flask
flask #目录
├── camwebserver # 一级子目录
│ ├── appcam.py #文件
│ ├── camera_pi.py #文件
│ ├── camera_pi.pyc
│ ├── static #二级子目录
│ │ └── style.css #文件
│ └── templates #二级子目录
│ └── index.html #文件
6、检查以上文件都创建好，为确保文件有执行的权限，建议将文件的权限都改为777。
cd flask
sudo chmod -R 777 camwebserver
7、在终端上运行python脚本：
cd camwebserver
sudo python appcam.py
运行成功之后看到如下输出：
pi@raspberrypi:~/flask $ cd camwebserver
pi@raspberrypi:~/flask/camwebserver $ ls
appcam.py camera_pi.py camera_pi.pyc static templates
pi@raspberrypi:~/flask/camwebserver $ sudo python appcam.py
* Running on http://0.0.0.0:8080/ (Press CTRL+C to quit)
* Restarting with stat
* Debugger is active!
* Debugger pin code: 293-786-523
8、转到自己的网络中的任何浏览器，并输入 http://树莓派的IP地址:8080，就可以访问到我们的应用了，如下所示：
参考文档：http://shumeipai.nxez.com/2018/07/03/video-streaming-web-server-with-flask.html?tdsourcetag=s_pctim_aiomsg