xiao-webcam-sta

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

XIAO ESP32S3 camera web apps — STA (router) mode

XIAO ESP32S3摄像头Web应用——STA（路由器）模式

The board joins the user's WiFi router. The PC/phone stays on its normal network (internet keeps working) and reaches the board at

http://<mdns-name>.local

or its DHCP IP.

Read the

xiao-esp32s3

skill (same repo) first for base workflow and pitfalls (especially: PSRAM flag mandatory, DTR reset-stuck recovery, no serial reads while a demo must keep running).

开发板将接入用户的WiFi路由器。电脑/手机保持连接常规网络（网络持续可用），可通过

http://<mdns-name>.local

或其DHCP分配的IP地址访问开发板。

请先阅读

xiao-esp32s3

技能（同一仓库）了解基础工作流程和注意事项（尤其注意：必须开启PSRAM标志、DTR复位卡死恢复方法、演示运行时无法进行串口读取）。

Step 1 — ALWAYS ask the user first

步骤1——务必先询问用户

Never invent, guess, or silently reuse WiFi credentials. Ask the user for:

공유기 SSID — must be a 2.4 GHz network (ESP32 cannot see 5 GHz; if the user gives
```
something_5G
```
, ask for the 2.4 GHz band name).
공유기 비밀번호.
mDNS 이름 (optional, default
```
xiao
```
) — page becomes
```
http://<name>.local
```
. Boards on the same LAN must each get a UNIQUE name.
Which app: collector, inference viewer, or both.

切勿自行编造、猜测或静默复用WiFi凭据。请向用户确认以下信息：

路由器SSID——必须为2.4 GHz网络（ESP32无法识别5 GHz网络；若用户提供
```
something_5G
```
，请询问其2.4 GHz频段的网络名称）。
路由器密码。
mDNS名称（可选，默认值为
```
xiao
```
）——页面访问地址将变为
```
http://<name>.local
```
。同一局域网内的开发板必须设置唯一名称。
选择应用类型：数据集收集器、推理查看器，或两者都要。

Step 2 — generate the sketch from the template

步骤2——从模板生成代码草图

Templates in

assets/

are verified working code — do not rewrite them:

```
assets/web_collect.ino.tpl
```
— dataset collector (gallery + delete + ZIP download)
```
assets/web_infer.ino.tpl
```
— live inference viewer (needs the
```
<project>_inferencing
```
Edge Impulse library installed in the sketchbook)

Copy the template to

<workspace>\<NN>_<name>\<NN>_<name>.ino

(folder = ino name), then replace the placeholders literally:

Placeholder	Meaning	Example
`__WIFI_SSID__`	2.4 GHz router SSID	`myhome`
`__WIFI_PASS__`	router password	`pass1234`
`__MDNS_NAME__`	hostname (lowercase, no spaces)	`xiao`
`__EI_PROJECT__`	inference app only — Edge Impulse project name, matching the installed `<name>_inferencing` library folder	`clfc`

The template already falls back to a

XIAO_CAM

hotspot if the router is unreachable for 15 s, so a wrong password degrades gracefully.

assets/

目录下的模板为已验证可用的代码——请勿重写：

```
assets/web_collect.ino.tpl
```
——数据集收集器（包含图库、删除功能、ZIP下载）
```
assets/web_infer.ino.tpl
```
——实时推理查看器（需在代码草图目录中安装
```
<project>_inferencing
```
Edge Impulse库）

将模板复制到

<workspace>\<NN>_<name>\<NN>_<name>.ino

（文件夹名称需与ino文件名称一致），然后按字面替换占位符：

占位符	含义	示例
`__WIFI_SSID__`	2.4 GHz路由器SSID	`myhome`
`__WIFI_PASS__`	路由器密码	`pass1234`
`__MDNS_NAME__`	主机名（小写，无空格）	`xiao`
`__EI_PROJECT__`	仅推理应用需填写——Edge Impulse项目名称，需与已安装的 `<name>_inferencing` 库文件夹名称匹配	`clfc`

模板已内置 fallback 机制：若15秒内无法连接路由器，将自动切换为

XIAO_CAM

热点模式，因此即使密码错误也能平稳降级。

Step 3 — compile, upload

步骤3——编译、上传

powershell

arduino-cli compile --fqbn esp32:esp32:XIAO_ESP32S3 --board-options PSRAM=opi <SKETCH_DIR>
arduino-cli upload -p COM4 --fqbn esp32:esp32:XIAO_ESP32S3 --board-options PSRAM=opi <SKETCH_DIR>

PSRAM=opi

is mandatory (camera + model need PSRAM). The inference build needs

--clean

if the Edge Impulse library was just swapped.

powershell

arduino-cli compile --fqbn esp32:esp32:XIAO_ESP32S3 --board-options PSRAM=opi <SKETCH_DIR>
arduino-cli upload -p COM4 --fqbn esp32:esp32:XIAO_ESP32S3 --board-options PSRAM=opi <SKETCH_DIR>

PSRAM=opi

为必填项（摄像头和模型需要PSRAM）。若刚更换Edge Impulse库，编译推理应用时需添加

--clean

参数。

Step 4 — verify end-to-end

步骤4——端到端验证

The PC is on the same LAN, so HTTP is the fastest proof the whole path works:

powershell

Start-Sleep -Seconds 20   # boot + WiFi join
curl.exe -s -m 15 http://<mdns-name>.local/ -o "$env:TEMP\page.html"
(Get-Item "$env:TEMP\page.html").Length     # > 1000 bytes = page served

电脑与开发板处于同一局域网，因此HTTP请求是验证整个链路是否正常的最快方式：

powershell

Start-Sleep -Seconds 20   # 启动+WiFi连接等待时间
curl.exe -s -m 15 http://<mdns-name>.local/ -o "$env:TEMP\page.html"
(Get-Item "$env:TEMP\page.html").Length     # 大于1000字节表示页面已成功提供

inference app only:

仅推理应用需执行：

curl.exe -s -m 15 http://<mdns-name>.local/classify # JSON with scores


If mDNS resolution is flaky, find the IP once (`ping <name>.local` or router
DHCP table) and use it directly — report BOTH addresses to the user.

curl.exe -s -m 15 http://<mdns-name>.local/classify # 返回包含置信度分数的JSON


若mDNS解析不稳定，可通过`ping <name>.local`或路由器DHCP表获取IP地址，直接使用该IP访问——需将两种地址都告知用户。

Watching the board over serial

通过串口监控开发板状态

HTTP proves the page is up, but it cannot show you why a board failed to join the router. Serial can: the sketch prints the SSID it tried, the IP it got, and the mDNS name. Use the

xiao-serial-monitor

skill for it.

powershell

mon                      # interactive, port auto-detected
.\scripts\mon.ps1 -Seconds 15    # bounded, for your own debugging

Expected on success:

Connecting to WiFi ... IP: 192.168.0.179
mDNS: http://<mdns-name>.local
Collector ready

Two things worth knowing rather than avoiding:

Opening the port resets the board via DTR, so the log restarts from boot. That is usually what you want here — the WiFi join messages only print once.
If a board ends up stuck showing only the ROM banner afterwards (pitfall 8 of
```
xiao-esp32s3
```
), re-running
```
arduino-cli upload
```
clears it.

When the user wants to watch it themselves, hand them the command rather than launching the interactive monitor from a tool call — it never returns. In Claude Code the

prefix runs it in their session:

! <path>\mon.ps1

HTTP请求可验证页面是否正常，但无法显示开发板连接路由器失败的原因。串口监控可以：代码草图会打印尝试连接的SSID、获取到的IP地址以及mDNS名称。请使用

xiao-serial-monitor

技能进行监控。

powershell

mon                      # 交互式监控，自动检测端口
.\scripts\mon.ps1 -Seconds 15    # 限时监控，用于自行调试

成功连接时的预期输出：

Connecting to WiFi ... IP: 192.168.0.179
mDNS: http://<mdns-name>.local
Collector ready

有两点需要了解而非规避：

打开串口端口会通过DTR复位开发板，因此日志会从启动时重新开始。这通常正是我们需要的——WiFi连接信息仅打印一次。
若开发板之后陷入仅显示ROM banner的状态（
```
xiao-esp32s3
```
技能中的注意事项8），重新运行
```
arduino-cli upload
```
即可解决。

当用户希望自行监控时，请将命令提供给他们，而非从工具调用中启动交互式监控——因为交互式监控不会返回。在Claude Code中，使用

前缀可在用户会话中运行：

! <path>\mon.ps1

Notes

注意事项

Collector page: captures go to an in-browser gallery (label badges, per-shot delete, "전체 ZIP 다운로드" produces
```
label.N.jpg
```
files ready for Edge Impulse). Refreshing the page clears the gallery — download the ZIP first.
Inference page: whole-frame colored box + top label + per-class confidence bars (classification model — per-object location boxes need a FOMO model).
The camera renders rotated 90°; the inference template already compensates (CW feature rotation, verified empirically).

数据集收集页面：拍摄的图片会存入浏览器端图库（包含标签标识、单张删除功能，“全部ZIP下载”会生成
```
label.N.jpg
```
格式的文件，可直接用于Edge Impulse）。刷新页面会清空图库——请先下载ZIP文件。
推理查看页面：显示全帧彩色框、顶部标签以及各类别的置信度条形图（适用于分类模型——若需显示目标位置框则需使用FOMO模型）。
摄像头画面会旋转90°；推理模板已对此进行补偿（顺时针特征旋转，经验证有效）。