使用python+flask实现树莓派的WEB控制

如果你想在网页上点击按钮，并且让树莓派接收到响应，并做响应的处理，实现网页上与树莓派进行数据交互以及一些数据渲染，那么希望这篇文章对你有所帮助：
源码放在git：https://github.com/StarFishing/ardunio/tree/master
树莓派与Arduino进行通信可以参考另一篇文章：https://blog.csdn.net/qq_34803821/article/details/86238387
首先先看效果图，总体效果我会放在文章末尾
这是已经写好的HTML页面，我截取了其中一部分，当我们点击蓝色按钮，树莓派打开Arduino板上的风扇，点击红色按钮关闭风扇

然后是树莓派做出的相应，接收到我的点击事件，并正确作出相应，在python中开始对Arduino进行通信，做到相应的处理

处理函数像这样：

@app.route('/fopen', methods=['POST', 'GET'])
def fopen():
    if request.method == 'GET':
        return render_template('index.html')
    else:
        single.flushOutput()
        single.write('1')
        return "Open OK"

接下来我们来看具体实现：
首先本项目的需求是可以在网页上控制Arduino板上的温湿度传感器，以及风扇，树莓派与Arduino进行串口通信，当我们点击打开按钮时，Arduino板打开风扇，温湿度数据通过树莓派上的python脚本，实时渲染到我们的网页上；
准备材料：
树莓派上安装flask：sudo pip install flask
python 串口读取：sudo pip insall pyserial
我们针对树莓派进行讲解，我们如何实现点击的相应，让树莓派接收到事件呢？

在HTML里面，我们做这样一件事情：

将我们的点击事件异步提交到相应的路由下

 <div class="open">
        <span class="warning">高温警告：span>
        <span class="text">已自动为您打开风扇span>
        <span class="close">关/开风扇：span> <i id="close">i
        ><i id="open">i>
      div>

  $('.open i').click(function() {
    if (this.id == 'close') {
      $.post('/fclose', this.id, function(data, status) {})
    }
    if (this.id == 'open') {
      $.post('/fopen', this.id, function(data, status) {})
    }
  })

树莓派中我们进行响应

然后在树莓派的python脚本中，我们定义处理的路由，接收到提交的路由，并进行处理

# codinf:utf-8
from flask import Flask, render_template, Response, request
import serial
port = "/dev/ttyACM0"
app = Flask(__name__)
single = serial.Serial(port, 9600)
single.flushInput()

@app.route('/fopen', methods=['POST', 'GET'])
def fopen():
    if request.method == 'GET':
        return render_template('index.html')
    else:
    # 在这里对你POST过来的请求做处理，获得请求体或者表单内容，我这里是对开发板写了一个数字
        single.flushOutput()
        single.write('1')
        return "Open OK"
 
if __name__ == '__main__':
    app.run(host='0.0.0.0', port=8080, debug=True, threaded=True)

总体效果图：