You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

ESP32:如何向WiFiManager设置页面添加非WiFi类配置项?

解决方案:在WiFiManager配置页面添加非WiFi参数&展示公钥

当然可以在WiFiManager的配置页面扩展非WiFi相关的配置项,而且完全不用修改它的核心架构,下面分两种方案给你参考:

一、直接用原生WiFiManager扩展(推荐,零侵入)

原生WiFiManager本身就支持添加自定义参数,通过WiFiManagerParameter类就能轻松实现服务器地址、用户名的输入,以及公钥的只读展示,核心代码示例如下:

#include <WiFiManager.h>

void setup() {
  Serial.begin(115200);

  // 1. 生成公钥(这里仅为示例,替换成你的实际生成逻辑)
  char device_pub_key[256];
  snprintf(device_pub_key, sizeof(device_pub_key), "MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAE...");

  // 2. 定义自定义参数
  // 服务器地址输入框:参数名、页面显示标签、默认值、最大长度
  WiFiManagerParameter param_server("server", "服务器地址", "your.server.com", 64);
  // 用户名输入框
  WiFiManagerParameter param_user("username", "用户名", "sensor_user", 32);
  // 公钥只读展示:最后一个参数设为WM_PARAM_FLAG_READONLY标记只读
  WiFiManagerParameter param_pubkey("pubkey", "设备公钥", device_pub_key, 256, WM_PARAM_FLAG_READONLY);

  // 3. 初始化WiFiManager并添加参数
  WiFiManager wm;
  wm.addParameter(&param_server);
  wm.addParameter(&param_user);
  wm.addParameter(&param_pubkey);

  // 4. 启动自动连接/配置页面
  if (!wm.autoConnect("SensorConfigAP")) {
    Serial.println("WiFi配置超时,重启设备");
    ESP.restart();
  }

  // 5. 获取用户配置的值
  String server_addr = String(param_server.getValue());
  String username = String(param_user.getValue());
  Serial.print("已配置服务器地址:");
  Serial.println(server_addr);
}

void loop() {
  // 你的传感器逻辑
}

这样配置页面会在原有WiFi设置项下方,自动新增你定义的服务器地址、用户名输入框,以及只读的公钥展示栏,所有参数会自动被WiFiManager保存到存储介质(EEPROM/SPIFFS),下次启动自动加载。

二、衍生库推荐(更灵活的UI)

如果需要更复杂的交互(比如密码框、下拉选择、分组展示),可以用以下基于WiFiManager的衍生库:

  • WiFiManagerExtended:在原生基础上扩展了更多UI组件,支持密码输入、只读文本、开关、下拉选单等,用法和原生WiFiManager完全兼容,几乎不用改原有代码就能升级UI。
  • ESPUI:可以和WiFiManager配合使用——先用WiFiManager完成WiFi配置,再启动ESPUI的Web界面管理服务器参数;也可以将两者整合到同一界面。它提供了更丰富的实时UI组件,适合动态更新展示内容(比如公钥生成后即时刷新显示)。

内容的提问来源于stack exchange,提问作者Marian

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.11 04:40:40