目录
1、安装flask库
2、使用flask打开网页传输视频
2.1 在树莓派终端桌面上，新建一个flask文件夹
2.2 在flask文件夹里面，新建一个template文件夹和app.py文件
2.3 在template文件夹里面，新建一个index.html文件
2.4 使用flask运行代码上传监控视频
3、使用ajax表单模拟按键，从flask传输数据到树莓派。
1、安装flask库
sudo install apt-get flask2、使用flask打开网页传输视频
2.1 在树莓派终端桌面上，新建一个flask文件夹
mkdir flask2.2 在flask文件夹里面，新建一个template文件夹和app.py文件
mkdir template
touch app.py
2.3 在template文件夹里面，新建一个index.html文件
touch index.html 
创建之后可以输入命令 ls 来查看当前文件夹内容，cd +文件夹名称 进入下一文件夹。
2.4 使用flask运行代码上传监控视频
我们需要编辑两个文件第一个是index.html，另外一个是app.py
第一个index.html简单的编写网页，代码如下：
<!DOCTYPE html>
<html>
<head>
<title>HHH</title>
</head>
<body>
<div class="header" id="demo">
<div class="title"><h2>CTRL</h2></div>
<form action="/video" method="post" enctype="multipart/form-data">
<img src="{{videourl}}">
<br>
</form>
</div>
</body>
</html>就是简单的获取视频编码的一个操作，flask自带的视频推流Motion JPEG。
第二个是app.py文件
代码如下：
# coding: utf-8
from flask import Flask,render_template,Response,request,url_for
import cv2
import numpy as np
import time
import os
app = Flask(__name__)
@app.route('/video', methods=['GET', 'POST'])
def videoshow():
return render_template('index.html',videourl=url_for('video_feed'))
@app.route('/video_feed',methods=['GET', 'POST'])
def video_feed():
return Response(gen(),mimetype='multipart/x-mixed-replace; boundary=frame')
def gen():
cap = cv2.VideoCapture(0)
cap.set(3,600)
cap.set(4,480)
cap.set(5,40)
while True:
ret, img = cap.read()
ret, jpeg = cv2.imencode('.jpg',img) # 对图像进行编码输出 jpeg
yield(b'--frame\r\n'+b'Content-Type: image/jpeg\r\n\r\n' + jpeg.tobytes() + b'\r\n\r\n')
if __name__ == '__main__':
app.run(host='192.168.137.99', port=5008, debug=True)简单解释一下：
@app.route(' A',methods=['B ']) 这个形式的是 路由，可以认为是flask和树莓派之间的交互工具，从网页地址跳转到网页上，也可以从网页上的数据跳转到函数。
A是网页地址的后缀，B是GET或POST请求，当网页获取到视频时，时GET请求，当按下表单时POST请求（树莓派接收网页按钮数据）
（1）在树莓派终端flask文件夹中输入python3 app.py 运行代码
python3 app.py会返回得到一个网页地址如图所示：http://192.168.137.100:5008/
（2）我们打开网页输入 http://192.168.137.100:5008/video
video是前面的A也就是一个路由的名称
（3）输入后我们就可以得到正在实时监控的网页。
这样就简单完成了视频监控功能。
简单说一下代码运行的流程
app.run运行当前ip地址和端口→运行第一个路由video，返回网页index.html→运行videourl，返回函数gen（）进行视频编码传输视频。
3、使用ajax表单模拟按键，从flask传输数据到树莓派。
ajax是用来解决什么问题？
当表单按下是，当前页面的视频会消失或者编码错误导致监控视频无法正常播放，或者重复刷新当前页面，导致摄像头重新打开，报错摄像头已被占用的问题。ajax可以只刷新表单页面，不刷新摄像头监控视频。
下面是我完整版的index.html和app.py代码
忘记存电脑里面了，不在实验室，下次补上。
