21ic电子技术开发论坛 › 单片机与嵌入式系统 › 灵动MM32 MCU › 【灵动微电子MM32F0121测评】9.ESP32-WEB控制 ...
返回列表 发新帖我要提问

[MM32硬件] 【灵动微电子MM32F0121测评】9.ESP32-WEB控制

[复制链接]
 楼主| 阿源玩电子 发表于 2025-7-10 23:20 | 显示全部楼层 |阅读模式
控制, 微电子, 电子, 硬件, We
本帖最后由 阿源玩电子 于 2025-7-12 11:02 编辑

#申请原创#
基于MM32F0121与ESP32的无线Web控制技术实现

1.项目概述

通过ESP32创建WiFi热点，搭建Web服务器，实现手机浏览器远程控制MM32F0121开发板：

  • 手机网页控制板载LED
  • 实时显示板载电位器电压值
  • 双向串口通信（ESP32 UART2 ↔ MM32F0121 UART2）


2.硬件搭建

ESP32 (UART2)         Mini_F0121-OB (UART2)     

────────────────────────────         

GPIO17 (TX2)    →      RX: PB8                     

GPIO16 (RX2)    ←        TX: PA8                     

                   GND            →      GND                                       


3.无线通信

使用Arduino开发环境，以下为ESP32部分：
  • WiFi名称：ESP32-Control
  • WiFi密码：12345678
  • IP地址:  192.168.4.1
  • 使用一颗板载蓝色LED，来显示运行状态
  • 长时间没有收到电压数据，会显示无数据字样
  • 同时能监控连接WIFI设备的数量

复制
  1. #include <WiFi.h>
    

  2. #include <WebServer.h>
    


  3. 

  4. // 热点配置
    

  5. const char* ap_ssid = "ESP32-Control";
    

  6. const char* ap_password = "12345678";
    

  7. const int statusLed = 2;  // ESP32 板载 LED 引脚用于状态指示
    


  8. 

  9. // 串口配置 (UART2: RX=16, TX=17)
    

  10. #define SERIAL2_RX 16
    

  11. #define SERIAL2_TX 17
    

  12. HardwareSerial SerialPort(2);  // 使用 UART2
    


  13. 

  14. WebServer server(80);
    


  15. 

  16. // 全局变量
    

  17. String voltageValue = "0.00V";  // 存储电压值
    

  18. unsigned long lastVoltageUpdate = 0;
    

  19. bool externalLEDState = false; 
    

  20. unsigned long lastBlinkTime = 0;
    

  21. bool ledState = LOW;
    


  22. 

  23. void handleRoot() {
    

  24.   String html = R"rawliteral(
    

  25.     <!DOCTYPE html>
    

  26.     <html>
    

  27.     <head>
    

  28.       <meta charset="UTF-8">
    

  29.       <title>ESP32 设备控制</title>
    

  30.       <meta name="viewport" content="width=device-width, initial-scale=1">
    

  31.       <style>
    

  32.         body { 
    

  33.           font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif; 
    

  34.           max-width: 600px; 
    

  35.           margin: 0 auto; 
    

  36.           padding: 20px;
    

  37.           background-color: #f5f5f5;
    

  38.         }
    

  39.         .card {
    

  40.           background: white;
    

  41.           border-radius: 10px;
    

  42.           box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    

  43.           padding: 20px;
    

  44.           margin-bottom: 20px;
    

  45.         }
    

  46.         h1 { color: #2c3e50; text-align: center; }
    

  47.         .btn {
    

  48.           display: block;
    

  49.           width: 100%;
    

  50.           padding: 15px;
    

  51.           margin: 10px 0;
    

  52.           background-color: #3498db;
    

  53.           color: white;
    

  54.           border: none;
    

  55.           border-radius: 5px;
    

  56.           font-size: 18px;
    

  57.           cursor: pointer;
    

  58.           transition: background-color 0.3s;
    

  59.         }
    

  60.         .btn-on { background-color: #27ae60; }
    

  61.         .btn-off { background-color: #e74c3c; }
    

  62.         .btn:hover { opacity: 0.9; }
    

  63.         .status {
    

  64.           padding: 15px;
    

  65.           text-align: center;
    

  66.           font-size: 20px;
    

  67.           margin: 15px 0;
    

  68.           border-radius: 5px;
    

  69.         }
    

  70.         .voltage { background-color: #f1c40f; color: #2c3e50; }
    

  71.         .external-led { background-color: %external_color%; }
    

  72.         .info { 
    

  73.           text-align: center; 
    

  74.           color: #7f8c8d; 
    

  75.           margin-top: 30px;
    

  76.           font-size: 14px;
    

  77.         }
    

  78.       </style>
    

  79.       <script>
    

  80.         function updateVoltage() {
    

  81.           fetch('/voltage')
    

  82.             .then(response => response.text())
    

  83.             .then(data => {
    

  84.               document.getElementById("voltage-value").innerHTML = data;
    

  85.               setTimeout(updateVoltage, 2000);
    

  86.             });
    

  87.         }
    

  88.         
    

  89.         function controlLED(state) {
    

  90.           fetch('/external/' + state)
    

  91.             .then(response => response.text())
    

  92.             .then(data => {
    

  93.               const statusElem = document.getElementById("external-status");
    

  94.               statusElem.innerHTML = "状态: " + data.toUpperCase();
    

  95.               statusElem.className = "status external-led";
    

  96.               statusElem.style.backgroundColor = state === "on" ? "#27ae60" : "#e74c3c";
    

  97.             });
    

  98.         }
    

  99.         
    

  100.         window.onload = function() {
    

  101.           updateVoltage();
    

  102.         };
    

  103.       </script>
    

  104.     </head>
    

  105.     <body>
    

  106.       <div class="card">
    

  107.         <h1>ESP32 设备</h1>
    

  108.         
    

  109.         <div class="card">
    

  110.           <h2>系统状态</h2>
    

  111.           <div class="status" style="background-color: #3498db; color: white;">
    

  112.             ESP32  (正常运行)
    

  113.           </div>
    

  114.         </div>
    

  115.         
    

  116.         <div class="card">
    

  117.           <h2>Mini_F0121-OB</h2>
    

  118.           <button class="btn btn-on" onclick="controlLED('on')">打开 LED</button>
    

  119.           <button class="btn btn-off" onclick="controlLED('off')">关闭 LED</button>
    

  120.           <div id="external-status" class="status external-led">状态: OFF</div>
    

  121.         </div>
    

  122.         
    

  123.         <div class="card">
    

  124.           <h2>电压监测</h2>
    

  125.           <div id="voltage-value" class="status voltage">读取中...</div>
    

  126.         </div>
    

  127.       </div>
    

  128.       
    

  129.       <div class="info">
    

  130.         IP: 192.168.4.1 | 连接设备: %client_count%
    

  131.       </div>
    

  132.     </body>
    

  133.     </html>
    

  134.   )rawliteral";
    

  135.   
    

  136.   // 动态替换内容
    

  137.   html.replace("%external_color%", externalLEDState ? "#27ae60" : "#e74c3c");
    

  138.   html.replace("%client_count%", String(WiFi.softAPgetStationNum()));
    

  139.   
    

  140.   server.send(200, "text/html; charset=utf-8", html);
    

  141. }
    


  142. 

  143. void handleExternalLED(String state) {
    

  144.   if (state == "on") {
    

  145.     SerialPort.println("LED_ON");  // 发送控制指令
    

  146.     externalLEDState = true;
    

  147.     server.send(200, "text/plain", "on");
    

  148.     Serial.println("Sent: LED_ON");
    

  149.   } else if (state == "off") {
    

  150.     SerialPort.println("LED_OFF"); // 发送控制指令
    

  151.     externalLEDState = false;
    

  152.     server.send(200, "text/plain", "off");
    

  153.     Serial.println("Sent: LED_OFF");
    

  154.   }
    

  155. }
    


  156. 

  157. // 获取电压值
    

  158. void handleVoltage() {
    

  159.   server.send(200, "text/plain", voltageValue);
    

  160. }
    


  161. 

  162. // 处理串口数据
    

  163. void processSerialData() {
    

  164.   if (SerialPort.available()) {
    

  165.     String data = SerialPort.readStringUntil('\n');
    

  166.     data.trim();
    

  167.     
    

  168.     // 电压数据格式: "VOLT:3.25"
    

  169.     if (data.startsWith("VOLT:")) {
    

  170.       voltageValue = data.substring(5) + "V";
    

  171.       lastVoltageUpdate = millis();
    

  172.       Serial.println("Received voltage: " + voltageValue);
    

  173.     }
    

  174.     // 外部 LED 状态反馈: "EXT_LED:ON"
    

  175.     else if (data.startsWith("EXT_LED:")) {
    

  176.       externalLEDState = (data.substring(8) == "ON");
    

  177.       Serial.println("External LED: " + String(externalLEDState ? "ON" : "OFF"));
    

  178.     }
    

  179.   }
    

  180. }
    


  181. 


  182. 

  183. void blinkStatusLED() {
    

  184.   if (millis() - lastBlinkTime > 1000) { 
    

  185.     lastBlinkTime = millis();
    

  186.     ledState = !ledState;
    

  187.     digitalWrite(statusLed, ledState);
    

  188.   }
    

  189. }
    


  190. 

  191. void setup() {
    

  192.   // 初始化串口
    

  193.   Serial.begin(115200);
    

  194.   SerialPort.begin(9600, SERIAL_8N1, SERIAL2_RX, SERIAL2_TX);
    

  195.   
    

  196.   // 初始化状态指示灯
    

  197.   pinMode(statusLed, OUTPUT);
    

  198.   digitalWrite(statusLed, LOW);
    

  199.   
    

  200.   // 创建热点
    

  201.   WiFi.softAP(ap_ssid, ap_password);
    

  202.   delay(100);
    

  203.   
    

  204.   Serial.println("\nAccess Point Created!");
    

  205.   Serial.println("SSID: " + String(ap_ssid));
    

  206.   Serial.println("Password: " + String(ap_password));
    

  207.   Serial.println("IP: " + WiFi.softAPIP().toString());
    

  208.   
    

  209.   // 设置路由
    

  210.   server.on("/", handleRoot);
    

  211.   server.on("/external/on", []() { handleExternalLED("on"); });
    

  212.   server.on("/external/off", []() { handleExternalLED("off"); });
    

  213.   server.on("/voltage", handleVoltage);
    

  214.   
    

  215.   server.begin();
    

  216.   Serial.println("HTTP server started");
    

  217.   
    

  218.   // 初始闪烁
    

  219.   digitalWrite(statusLed, HIGH);
    

  220.   delay(500);
    

  221.   digitalWrite(statusLed, LOW);
    

  222. }
    


  223. 

  224. void loop() {
    

  225.   server.handleClient();  // 处理网页请求
    

  226.   processSerialData();    // 处理串口数据
    

  227.   blinkStatusLED();       // 更新LED闪烁状态
    

  228.   
    

  229.   // 电压数据超时处理
    

  230.   if (millis() - lastVoltageUpdate > 5000) {
    

  231.     voltageValue = "无数据";
    

  232.   }
    

  233. }

4.MM32F0121部分

  • 使用板载的蓝色LED作为运行指示灯
  • 使用板载的绿色LED作为控制的对象
  • 使用RTOS，TASK1为运行指示灯任务，TASK2为电压检测任务
  • USART2部分配置代码如下
复制
  1. void USART2_Configure(uint32_t Baudrate)
    

  2. {
    

  3.     GPIO_InitTypeDef  GPIO_InitStruct;
    

  4.     NVIC_InitTypeDef  NVIC_InitStruct;
    

  5.     USART_InitTypeDef USART_InitStruct;
    


  6. 

  7.     RCC_APB1PeriphClockCmd(RCC_APB1Periph_USART2, ENABLE);
    


  8. 

  9.     USART_StructInit(&USART_InitStruct);
    

  10.     USART_InitStruct.USART_BaudRate   = Baudrate;
    

  11.     USART_InitStruct.USART_WordLength = USART_WordLength_8b;
    

  12.     USART_InitStruct.USART_StopBits   = USART_StopBits_1;
    

  13.     USART_InitStruct.USART_Parity     = USART_Parity_No;
    

  14.     USART_InitStruct.USART_Mode       = USART_Mode_Rx | USART_Mode_Tx;
    

  15.     USART_InitStruct.USART_HardwareFlowControl = USART_HardwareFlowControl_None;
    

  16.     USART_Init(USART2, &USART_InitStruct);
    


  17. 

  18.     RCC_AHBPeriphClockCmd(RCC_AHBPeriph_GPIOA, ENABLE);
    

  19.     RCC_AHBPeriphClockCmd(RCC_AHBPeriph_GPIOB, ENABLE);
    


  20. 

  21.     GPIO_PinAFConfig(GPIOA, GPIO_PinSource8, GPIO_AF_3);
    

  22.     GPIO_PinAFConfig(GPIOB, GPIO_PinSource8, GPIO_AF_4);
    


  23. 

  24.     GPIO_StructInit(&GPIO_InitStruct);
    

  25.     GPIO_InitStruct.GPIO_Pin   = GPIO_Pin_8;
    

  26.     GPIO_InitStruct.GPIO_Speed = GPIO_Speed_High;
    

  27.     GPIO_InitStruct.GPIO_Mode  = GPIO_Mode_AF_PP;
    

  28.     GPIO_Init(GPIOA, &GPIO_InitStruct);
    


  29. 

  30.     GPIO_StructInit(&GPIO_InitStruct);
    

  31.     GPIO_InitStruct.GPIO_Pin   = GPIO_Pin_8;
    

  32.     GPIO_InitStruct.GPIO_Mode  = GPIO_Mode_FLOATING;
    

  33.     GPIO_Init(GPIOB, &GPIO_InitStruct);
    


  34. 

  35.     NVIC_InitStruct.NVIC_IRQChannel = USART2_IRQn;
    

  36.     NVIC_InitStruct.NVIC_IRQChannelPriority = 0;
    

  37.     NVIC_InitStruct.NVIC_IRQChannelCmd = ENABLE;
    

  38.     NVIC_Init(&NVIC_InitStruct);
    


  39. 

  40.     USART_ITConfig(USART2, USART_IT_RXNE, ENABLE);
    


  41. 

  42.     USART_Cmd(USART2, ENABLE);
    

  43. }
    

  44. void USART_SendString(USART_TypeDef* USARTx, const char* str) {
    

  45.     while (*str) {
    

  46.         USART_SendData(USARTx, (uint8_t)(*str++));
    

  47.         while (USART_GetFlagStatus(USARTx, USART_FLAG_TC) == RESET);
    

  48.     }
    

  49. }
    


  50. 

  51. void USART_Printf(USART_TypeDef* USARTx, const char* fmt, ...) {
    

  52.     char buffer[128];  
    

  53.     va_list args;
    

  54.     va_start(args, fmt);
    

  55.     vsnprintf(buffer, sizeof(buffer), fmt, args);  
    

  56.     va_end(args);
    

  57.     USART_SendString(USARTx, buffer);  
    

  58. }
    


  59. 

  60. #define MAX_CMD_LEN 32  
    


  61. 

  62. char receivedCmd[MAX_CMD_LEN];  
    

  63. uint8_t cmdIndex = 0;          
    


  64. 

  65. void USART2_IRQHandler(void) 
    

  66. {
    

  67.     if(USART_GetITStatus(USART2, USART_IT_RXNE) != RESET) 
    

  68.     {
    

  69.         uint8_t data = USART_ReceiveData(USART2);
    

  70.         
    

  71.         if(data == '\r' || data == '\n' || cmdIndex >= MAX_CMD_LEN-1) 
    

  72.         {
    

  73.             receivedCmd[cmdIndex] = '\0'; 
    

  74.            
    

  75.             if(strcmp(receivedCmd, "LED_ON") == 0) {
    

  76.                                                                 GPIO_WriteBit(GPIOB,GPIO_Pin_15,0);
    

  77.                 printf("ACK: LED OFF\r\n");
    

  78.             }
    

  79.             else if(strcmp(receivedCmd, "LED_OFF") == 0) {
    

  80.                                                                 GPIO_WriteBit(GPIOB,GPIO_Pin_15,1);
    

  81.                 printf("ACK: LED ON\r\n");
    

  82.             }
    

  83.             cmdIndex = 0; 
    

  84.         } 
    

  85.         else 
    

  86.         {
    

  87.             receivedCmd[cmdIndex++] = data; 
    

  88.         }
    

  89.         
    

  90.         while(USART_GetFlagStatus(USART2, USART_FLAG_TC) == RESET);
    

  91.     }
    

  92. }
  • ADC部分循环采集，循环上报
复制
  1. #include "adc_dsp.h"
    


  2. 

  3. uint32_t ADC_InterruptFlag;
    


  4. 

  5. void ADC_Configure(void)
    

  6. {
    

  7.     ADC_InitTypeDef  ADC_InitStruct;
    

  8.     GPIO_InitTypeDef GPIO_InitStruct;
    

  9.     NVIC_InitTypeDef NVIC_InitStruct;
    


  10. 

  11.     RCC_APB2PeriphClockCmd(RCC_APB2Periph_ADC, ENABLE);
    


  12. 

  13.     ADC_StructInit(&ADC_InitStruct);
    

  14.     ADC_InitStruct.ADC_Resolution = ADC_Resolution_12b;
    

  15.     ADC_InitStruct.ADC_Prescaler  = ADC_Prescaler_16;
    

  16.     ADC_InitStruct.ADC_Mode       = ADC_Mode_Continue;
    

  17.     ADC_InitStruct.ADC_DataAlign  = ADC_DataAlign_Right;
    

  18.     ADC_Init(ADC1, &ADC_InitStruct);
    


  19. 

  20.     ADC_SampleTimeConfig(ADC1, ADC_Channel_3, ADC_SampleTime_240_5);
    


  21. 

  22.     ADC_AnyChannelNumCfg(ADC1, 0);
    

  23.     ADC_AnyChannelSelect(ADC1, ADC_AnyChannel_0, ADC_Channel_3);
    

  24.     ADC_AnyChannelCmd(ADC1, ENABLE);
    


  25. 

  26.     ADC_ClearFlag(ADC1, ADC_FLAG_EOC);
    

  27.     ADC_ITConfig(ADC1, ADC_IT_EOC, ENABLE);
    


  28. 

  29.     RCC_AHBPeriphClockCmd(RCC_AHBPeriph_GPIOA, ENABLE);
    


  30. 

  31.     /* PA3(POT) */
    

  32.     GPIO_StructInit(&GPIO_InitStruct);
    

  33.     GPIO_InitStruct.GPIO_Pin   = GPIO_Pin_3;
    

  34.     GPIO_InitStruct.GPIO_Speed = GPIO_Speed_High;
    

  35.     GPIO_InitStruct.GPIO_Mode  = GPIO_Mode_AIN;
    

  36.     GPIO_Init(GPIOA, &GPIO_InitStruct);
    


  37. 

  38.     NVIC_InitStruct.NVIC_IRQChannel = ADC_COMP_IRQn;
    

  39.     NVIC_InitStruct.NVIC_IRQChannelPriority = 0x00;
    

  40.     NVIC_InitStruct.NVIC_IRQChannelCmd = ENABLE;
    

  41.     NVIC_Init(&NVIC_InitStruct);
    


  42. 

  43.     ADC_Cmd(ADC1, ENABLE);
    


  44. 

  45. }
    


  46. 


  47. 

  48. void ADC_InternalVoltageSensor_Sample(void)
    

  49. {
    

  50.           float    Voltage;
    

  51.     uint16_t ConversionValue = 0;
    

  52.       ADC_SoftwareStartConvCmd(ADC1, ENABLE);
    

  53.     while (1)
    

  54.     {
    


  55. 

  56.         if (0 != ADC_InterruptFlag)
    

  57.         {
    

  58.         ConversionValue = (float)ADC_GetChannelConvertedValue(ADC1, ADC_Channel_3);
    

  59.                                  Voltage = (float)ConversionValue *(float)3.3 / (float)4096.0;
    

  60.                                 printf("\r\nVDDA = %0.2fV", Voltage);
    

  61.                                 USART_Printf(USART2,"\r\nVOLT:%0.1f",Voltage);
    

  62.                                 vTaskDelay(1);                                         
    

  63.         }
    

  64.     }
    

  65. }
    


  66. 

  67. void ADC_COMP_IRQHandler(void)
    

  68. {
    

  69.     if (RESET != ADC_GetITStatus(ADC1, ADC_IT_EOC))
    

  70.     {
    

  71.         ADC_InterruptFlag = 1;
    


  72. 

  73.         ADC_ClearITPendingBit(ADC1, ADC_IT_EOC);
    

  74.     }
    

  75. }
5.实验现象

LED控制.gif 电压上传.gif



ESP32_WEB.zip

2.67 KB, 下载次数: 0

MM32F0121C6PV_09ESP32.zip

6.53 MB, 下载次数: 0
回复 赏

举报

相关帖子
AdaMaYun 发表于 2025-7-31 17:28 | 显示全部楼层
ESP32-WEB控制
回复 赏

举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 注册

本版积分规则

阿源玩电子

12

主题

33

帖子

0

粉丝
快速回复 在线客服 返回列表 返回顶部