闪电麦昆语音控制齿轮行进轨迹，ESP32搭配语音控制板，串口通信，附视频演示地址

演示地址 https://www.bilibili.com/video/BV1cW421d79L/?vd_source=b8515e53f6d4c564b541d98dcc9df990

语音控制板的配置
在这里插入图片描述

web展示页面
在这里插入图片描述

esp32 程序

#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
#include <LittleFS.h>
#include <WebSocketsServer.h>ESP8266WebServer server(80);
WebSocketsServer webSocket = WebSocketsServer(81); // WebSocket服务器在端口81上运行void setup() {Serial.begin(115200);WiFi.softAP("ESP8266-AP", "12345678");// 初始化LittleFSif (!LittleFS.begin()) {Serial.println("An Error has occurred while mounting LittleFS");return;}server.on("/", HTTP_GET, handleRoot);server.on("/paper-full.min.js", HTTP_GET, handleJS);server.on("/chilun.svg", HTTP_GET, handleSVG); // 添加路由处理SVG请求server.begin();Serial.println("HTTP server started");webSocket.begin(); // 启动WebSocket服务器webSocket.onEvent(webSocketEvent); // 注册WebSocket事件处理函数
}void handleRoot() {File file = LittleFS.open("/index.html", "r");if (!file) {Serial.println("File not found");return;}server.streamFile(file, "text/html");file.close();
}void handleJS() {File file = LittleFS.open("/paper-full.min.js", "r"); // 打开JavaScript文件if (!file) {Serial.println("File not found");return;}server.streamFile(file, "application/javascript"); // 确保MIME类型是正确的file.close();
}// 处理SVG文件的请求
void handleSVG() {File file = LittleFS.open("/chilun.svg", "r");if (!file) {Serial.println("File not found");return;}server.streamFile(file, "image/svg+xml"); // 确保MIME类型设置为SVGfile.close();
}// WebSocket事件处理函数
void webSocketEvent(uint8_t num, WStype_t type, uint8_t * payload, size_t length) {switch(type) {case WStype_DISCONNECTED:Serial.printf("[%u] Disconnected!\n", num);break;case WStype_CONNECTED:{IPAddress ip = webSocket.remoteIP(num);Serial.printf("[%u] Connected from %d.%d.%d.%d\n", num, ip[0], ip[1], ip[2], ip[3]);webSocket.sendTXT(num, "Hello from ESP8266"); // 向连接的客户端发送消息}break;case WStype_TEXT:{Serial.printf("[%u] Received Text: %s\n", num, payload);// 将接收到的消息广播给所有连接的客户端String message = String((char *)payload); // 将payload转换为String对象，以便处理webSocket.broadcastTXT(message); // 使用broadcastTXT直接广播消息}}
}void loop() {server.handleClient();webSocket.loop(); // 确保处理WebSocket事件// 检查串口是否有数据读取if (Serial.available() > 0) {String data = Serial.readString(); // 读取串口数据Serial.print("Received from Serial: "); // 打印接收到的消息Serial.println(data); // 显示串口接收到的数据webSocket.broadcastTXT(data); // 将读取到的数据发送给所有WebSocket客户端}
}