很多用esp32diy的产品中,用户需要在首次使用时设定好wifi参数,基本思路就是开机之后,esp32自身作为热点,用户连接此热点后,访问网页设定参数,esp32将参数存入自身,保证断电保存。重启后,默认使用用户保存的参数去连接wifi。之后的使用中,如果要改变网络环境,使用某种触发方式,比如开机时长按某个按钮,进入esp32热点状态。
根据前面的两篇文章,已经实现了eps32作为热点显示网页,用户在网页中提交数据,那么接下来,只要能实现将数据保存在开发板上即可。
- 给用户一个设定参数的网页
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><style>.font1 {color:red;}</style>
</head><body><h1 class="font1">修改字体颜色</h1><form action="http://192.168.4.1:5000/" method="post"> <select name="select_color" id="select_color"><option value="blue">蓝色</option><option value="red">红色</option> </select><input type="submit" value="Submit" /></form>
</body></html>
显示出来之后,选择页面上的字体颜色,提交。
- 保存用户的参数
import network
# 创建一个WLAN对象,并将其设置为AP模式(接入点模式)
ap = network.WLAN(network.AP_IF)
ap.active(True)# 配置接入点的参数,包括SSID(网络名称)和密码
ap.config(essid='MyESP32AP', password='password123')# 打印接入点的IP地址
print('AP IP address:', ap.ifconfig())from microdot import Microdot, send_file
app = Microdot()@app.route('/', methods=['GET', 'POST'])
async def index(request):if request.method == 'POST':#将request.body的二进制字符串解码,然后分割出参数值color_receive=request.body.decode('utf-8').split('=')[1]print("设定颜色:",color_receive)#打开index.html文件,逐行读取,遇到设定字体color这一行后,修改该行内容with open('index.html', 'r') as file:lines = file.readlines()for i, line in enumerate(lines):if 'color' in line:print(lines[i])print(lines[i].encode())lines[i]='color:'+ color_receive+";\n"break#替换后用户提交的颜色后,写入文件with open('index.html', 'w') as file:for line in lines:file.write(line) #每次提交后,重写发送修改过的文件return send_file('index.html')app.run(debug=True)
先判读用户的请求是get还是post,如果是post,就分析用户提交的颜色,这里是从request.body中提取的,request.body是二进制字符串,所以先解码,然后根据关键词“=”来分割,得到颜色。
之后逐行读取index.html,到css代码中设定color的那一行,替换掉原来的内容。
最终,将新的html发送给用户,看到修改效果。
至此,实现了esp32保存用户提交数据,至于数据的用处可以灵活掌握,可以配置闪灯的频率,可以配置定时器,自由发挥吧。