GPIOViewer就是一个轻量级的Arduino库。但它的牛逼之处在于，你只要在你的ESP32项目里加上几行代码，它就能在你的ESP32上跑起来一个微型网页服务器。

然后，你在同一个局域网里，用电脑或者手机浏览器打开一个特定网址，奇迹就发生了——一个和你手头ESP32开发板长得一模一样的虚拟板子会出现在屏幕上。最关键的是，上面每一个GPIO引脚的状态，比如高低电平、PWM波形、ADC电压值，全都是实时动态显示的！

哪个引脚是高电平，哪个是低电平，哪个在输出PWM，一目了然。你代码里一个digitalWrite(pin, HIGH)，网页上对应的引脚立马就“亮”了。这感觉，就好像给你的ESP32开了个透视挂。

安装和上手

假设你用的是Arduino IDE。

1. 装库：打开Arduino IDE的库管理器，直接搜 GPIOViewer、ESPAsyncWebServer、AsyncTCP 这三个库，挨个点安装。齐活儿。
2. 抄代码：在你自己的项目代码里，开头加上 #include <gpio_viewer.h>，然后声明一个全局对象 GPIOViewer gpio_viewer;。
3. 启动！：在你setup()函数的最后面，加上两三行代码，就大功告成了。

给你个最简示例：

#include <gpio_viewer.h> // 记住，这行最好放在所有include的最前面

GPIOViewer gpio_viewer;

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

  // ESP32连上WiFi，填你自己的WiFi名和密码
  // 如果你自己的代码里已经联网了，这行就不用了
  gpio_viewer.connectToWifi("你家WiFi名字", "你家WiFi密码");

  // 这里是你自己原来的setup代码，该干啥干啥
  // 比如 pinMode(13, OUTPUT);

  // 关键！在你所有setup代码的最后，启动它！
  gpio_viewer.begin();
}

void loop() {
  // 你自己的loop代码
  // 比如 digitalWrite(13, !digitalRead(13)); delay(500);
  // 然后你就能在网页上看到13号引脚疯狂闪烁了
}

代码烧进去，打开串口监视器，它会打印出一个IP地址，类似 http://192.168.x.x:8080。复制这个地址到浏览器里一回车，见证奇迹的时刻就到了！

提示

这玩意儿我用了挺久，也踩过一些坑，顺便分享给你：

• WiFi信号要稳：毕竟是靠WiFi传数据，你ESP32离路由器太远，信号不好，网页上的刷新就会卡顿。官方说WiFi 6下25ms采样间隔都稳如老狗，咱普通WiFi，默认的100ms也足够用了。
• 编译不过别慌：十有八九是库的依赖或者ESP32内核版本问题。确保你的ESP32 Arduino Core是v3.0.0以上的版本。还有个玄学问题，就是把 #include <gpio_viewer.h> 放到所有#include语句的最顶上，有时候能解决莫名其妙的编译错误。
• 支持的板子超多：官方列表里支持几十种常见的ESP32、ESP32-S3/C3/C6甚至ESP8266板子。就算你的板子不在列表里，也可以用“通用视图”，虽然没那么酷，但功能一点不少。
• 库大小问题：它会给你的固件增加大概50KB。你可能会觉得有点大，但放心，那些酷炫的开发板图片资源都是从网页动态加载的，没占用你ESP32宝贵的Flash空间。

总而言之，GPIOViewer这个库，它用最简单直接的方式，解决了我们开发中最头疼、最耗时的一个环节。它可能不会帮你分析出纳秒级的信号抖动，但它绝对能让你在几分钟内定位到哪个引脚的电平不对，哪个PWM没按预期输出。

项目地址：https://github.com/thelastoutpostworkshop/gpio_viewer