树莓派+Flask实现视频流媒体WEB服务器

最新推荐文章于 2022-07-17 17:21:31 发布

零涂

最新推荐文章于 2022-07-17 17:21:31 发布

阅读量1.4k

点赞数

分类专栏：物联网

原文链接：https://shumeipai.nxez.com/2018/07/03/video-streaming-web-server-with-flask.html

版权

物联网专栏收录该内容

6 篇文章 0 订阅

订阅专栏

转载: https://shumeipai.nxez.com/2018/07/03/video-streaming-web-server-with-flask.html

安装FLASK

有好几种方法可以流式传输视频。我认为最好的（也是“更轻松”）方法是使用Miguel Grinberg开发的Flask。有关Flask如何执行此操作的详细说明，请参阅他的精彩教程：flask-video-streaming-revisited。

在我这个教程中：Python Web服务器将借助Flask和树莓派。我们要更详细地了解了Flask是如何工作、如何实现Web服务器以及从传感器上捕获数据并在网页上显示其状态。在本教程中的第一部分就是发送到我们前端的数据的视频流。

创建一个Web服务器环境：
首先要做的是在你的树莓派上安装Flask。如果没有，去终端并输入：

1	`sudo` `apt-get` `install` `python3-flask`

当你开始一个新项目时，最好的办法就是创建一个文件夹来保存你的文件。例如：
回到主页，到你的工作目录：

1	`cd` `Documents`

新建文件夹，例如：

1	`mkdir` `camWebServer`

按照上面的命令，创建一个名为“camWebServer”的文件夹，并在这里保存我们的python脚本：

1	`/home/pi/Document/ camWebServer`

现在，在这个文件夹上，我们将创建两个子文件夹：静态的CSS、最终的JavaScript文件以及HTML文件的模板。转到你的新创建的文件夹：

1	`cd` `camWebServer`

并创建2个新的子文件夹：

1	`mkdir` `static`

和

1	`mkdir` `templates`

最终的目录“树”，如下所示：

├── Documents
       ├── camWebServer
               ├── templates
               └── static

完成！让我们在创建好的的环境下，用Python Web 服务器应用程序来流式传输视频。

创建视频流媒体服务器

首先，下载Miguel Grinberg的树莓派相机软件包：camera_pi.py并将其保存在创建的目录camWebServer上。这是我们项目的核心，Miguel的安装包相当的不错。
现在，使用Flask，让我们调整原始的Miguel的web服务器应用程序（app.py），创建一个特定的python脚本来渲染我们的视频。我们可以命名为appCam.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 =80, debug=True, threaded=True)

以上脚本将你的摄像机视频流式传输到index.html页面上，如下所示：

<html>
  <head>
    <title>MJRoBot Lab Live Streaming</title>
    <link rel="stylesheet" href='../static/style.css'/>
  </head>
  <body>
    <h1>MJRoBot Lab Live Streaming</h1>
    <h3><img src="{{ url_for('video_feed') }}" width="90%"></h3>
    <hr>
    <p> @2018 Developed by MJRoBot.org</p>
  </body>
</html>

视频将会在这里“反馈”到我们的网页上。

你还必须在静态目录中包含style.css文件，以便以这种形式获得上述结果。
所有文件都可以从我的GitHub仓库下载获得：camWebServer。

确保所有的文件都在正确的位置，所有数据更新后，检查一下我们的环境：

├── Documents
       ├── camWebServer
               ├── camera_pi.py
               ├── appCam.py
               ├── templates
               |     ├── index.html
               └── static
                     ├── style.css

现在，在终端上运行python脚本：

1	`<p>sudo` `python3 appCam.py</p>`

转到你的网络中的任何浏览器，并输入 http://树莓派的IP地址/
注意：如果你不能确定你的树莓派IP地址，请在你的终端上运行：

1	`ifconfig`

在wlan0：部分你会找到它。
就是这样了！从现在开始，唯一的问题是需要一个复杂的页面，将你的视频嵌入到另一个页面等。

输入 http://树莓派ip:80 查看web监控页面

零涂

关注

0
点赞
踩
20

收藏

觉得还不错? 一键收藏
1
评论
树莓派+Flask实现视频流媒体WEB服务器

转载:https://shumeipai.nxez.com/2018/07/03/video-streaming-web-server-with-flask.html安装FLASK有好几种方法可以流式传输视频。我认为最好的（也是“更轻松”）方法是使用Miguel Grinberg开发的Flask。有关Flask如何执行此操作的详细说明，请参阅他的精彩教程：flask-video-stre...
复制链接

扫一扫