已经有 Windows 客户端了，为什么还要再写一个网页版？
这篇文章只聊两件事：它能干什么 ，以及我为什么还要做第二个版本。
转载请注明出处，谢谢
| 项目 | 说明 |
|---|---|
| 名称 | RiverPlusCOM Web · 在线串口调试助手 |
| 在线地址 | com.riverplus.top/ |
| 运行环境 | 浏览器（Chrome / Edge 89+），无需安装任何软件 |
| 支持的平台 | Windows / macOS / Linux / ChromeOS ------ 只要有浏览器就能跑 |
| 费用 | 免费在线使用 |
| 作者 | 程序员江涛_RiverPlus |
一、先说说这个"第二个版本"是怎么来的
我平时没少和各种串口设备打交道。为了调试顺手，自己动手写了桌面版 RiverPlusCOM------一个 WinForms 的串口调试助手，能自动回复、能循环发指令、配置还能自己记住。它一直是我工位上的主力工具。
但它有个绕不过去的毛病：要装。
得先有 Windows，再装 .NET Framework 4.8，然后下载、解压、双击。对天天用的人来说这不算什么；可一旦场景变成"临时"，这些步骤就变得很烦：
- 到客户现场，对方递过来一台笔记本，上面什么都没有，你也不好意思先给人家装一堆运行库；
- 同事只是想看一眼你调的设备，你却要先发一个压缩包，再远程指导他解压和装运行库；
- 你在 Mac 或 Linux 上，客户端根本打不开；
- 有些人对来路不明的 exe 天生警惕------这个顾虑很合理。
于是我想：能不能让这件事变成"打开一个网页"？
试了一下，浏览器其实已经准备好了。现代 Chromium 内核的浏览器提供了一个原生接口（Web Serial），可以直接和串口设备通信------读写数据、控制流控信号、监听拔线，都能做。也就是说，串口调试这件事，真的可以完全在网页里跑完，不需要任何本地安装。
于是我把它做出来了。它就是 RiverPlusCOM Web。
二、和客户端是什么关系？
先给结论：网页版是补充，不是替代。
桌面版依然是我的主力工具，它功能更完整、配置能备份成文件、能自动存盘；网页版解决的是"我现在就要用，但我没法装东西"这一类场景。两者用同一套交互逻辑，会用其中一个，另一个不用学。
网页版比客户端强的地方：
- 零安装：打开链接就能用，换电脑、换系统、借别人的机器都不受影响；
- 分享成本几乎为零：给同事发一条链接，比发安装包快得多；
- 拔线自动断开：物理拔掉设备，网页会立刻感知并把连接状态改掉，不会留一个"假连接"；
- 状态栏多了一组线路信号：DCD / DSR / CTS / RI 的状态直接显示出来，排查硬件握手问题时有帮助；
- 自动回复支持 16 进制应答：二进制协议也能自动接话，这一点客户端暂时还没做。
网页版做不到的，我也如实写出来------这些限制全部来自浏览器，不是偷懒：
| 项目 | 桌面版 | 网页版 |
|---|---|---|
| 端口识别 | COM3 这类系统口号 |
只有芯片型号，如 CH340 (1A86:7523) |
| 端口选择 | 自动枚举全部串口 | 每次手动点「选择串口」授权 |
| 数据位 | 5 / 6 / 7 / 8 | 7 / 8 |
| 停止位 | 1 / 1.5 / 2 | 1 / 2 |
| 校验位 | None / Odd / Even / Mark / Space | None / Odd / Even |
| 配置存储 | INI 文件，可拷贝备份 | 浏览器本地存储，清数据会丢 |
| 自动存盘 | 支持 | 不支持，需要手动「保存 TXT」 |
| 运行环境 | Windows 双击即用 | Chrome / Edge 89+，须 HTTPS 或 localhost |
💡 一句话选择建议：长期在工位上用，装客户端；临时、演示、给别人用，开网页。
三、功能全景
网页版把客户端上日常最常用的几件事都搬过来了------除了上面表格里那几条浏览器绕不过去的限制，其余照旧
界面是左右分栏：左边整块是收发区，右边是固定宽度的功能面板（串口配置 / 单条发送 / 多条发送 / 自动回复 / 帮助），底部一条状态栏任何时候都在。窄屏（1180px 以下）会自动变成上下布局，收发区不会被挤没。
四、功能详解
4.1 串口配置：把线接上
| 参数 | 可选值 | 默认值 |
|---|---|---|
| 串口 | 点「选择串口」从系统弹窗里挑一个设备 | 未选择 |
| 波特率 | 预置 1200 ~ 921600，也可直接输入任意值 | 9600 |
| 数据位 | 7 / 8 | 8 |
| 停止位 | 1 / 2 | 1 |
| 校验位 | None / Odd / Even | None |
| 流控 | 无 / 硬件 RTS/CTS | 无 |
| 控制信号 | DTR / RTS 开关 | 关闭 |
几个细节：
- 为什么端口显示的是
CH340而不是COM3？ 浏览器出于隐私考虑不把系统串口号给网页，只给 USB 的厂商/产品编号。所以我做了一层映射，把常见 USB 转串口芯片的编号翻译成可读名字（CH340、CP2102、FT232、PL2303、ESP32......），认不出型号时至少告诉你厂商是谁。看不见COM3确实不如客户端直观，但至少不会面对一串天书。 - 为什么每次都要手动点「选择串口」？ 浏览器不允许网页静默扫描你的串口设备，必须在用户点击的那一刻弹出选择器。这是浏览器的安全设计，绕不过去，网页版也刻意不记住上次选的端口------每次打开下拉框都是空的，需要你亲手挑一次，避免误连到别的设备。
- 打开串口后参数会锁定，包括「选择串口」按钮，防止连线中途误改参数；要改就先关掉。
- 勾了硬件流控，RTS 就交给驱动接管，手动开关会失效------这是正常的，界面上也有提示。
4.2 接收区：看得清，也停得住
① 四个显示开关
| 开关 | 作用 | 默认 |
|---|---|---|
| 16 进制显示 | 收到的数据以 48 65 6C 6C 6F 形式展示，排查二进制协议不再是天书 |
关 |
| 时间戳 | 每条报文前加 [HH:mm:ss.fff] 毫秒级前缀 |
开 |
| 显示发送回显 | 自己发出去的内容也回显到接收区 | 开 |
| 自动滚动 | 新数据到来时自动跟随滚动到最新 | 开 |
② 连续数据自动合并成一条报文
串口数据往往是一段一段到的，一条完整报文可能被拆成好几次到达。网页版沿用了客户端那套逻辑：把短时间内连续到达的内容自动合并成一条 ，只打一个时间戳，同时保留报文自带的换行。所以日志里一条报文就是一条，和导出成 TXT 后的观感完全一致。
③ 关掉自动滚动，画面就停住了
这一点在"盯着看某一帧"的时候特别有用：关掉自动滚动后，你翻上去的历史内容不会被新数据冲掉，正在选中的文字也不会丢。
④ 三色日志，一眼分清谁在说话
| 内容 | 颜色 | 前缀 |
|---|---|---|
| 接收到的数据 | 深灰 | [收] |
| 自己发出的内容 | 蓝色 | [发] |
| 自动回复发出的内容 | 青绿 | [自动回复] |
⑤ 长报文不会撑出横向滚动条：超长的一行会在可视宽度内自动换行，不用左右拖着看。
⑥ 容量保护：日志超过 5000 条后自动丢弃最旧的一批，长时间挂机也不会把页面拖垮。需要留存就点「保存 TXT」，或者「复制全部」直接贴进笔记。
4.3 单条发送：回车即发 + 发送历史
- 回车 = 发送 ，Ctrl + 回车 = 在光标处换行（不会发送）。调试多行指令时这个区别很关键，和客户端的操作习惯完全一致。
- 发送历史 ：自动记住最近 20 条发送过的内容，下拉即可复用。按内容去重，重复发送的内容会被提到最前面；多行指令也能完整保留和回填。
- 16 进制发送 ：支持空格、横杠、逗号分隔，形如
A1 B2 C3-D4；格式不对会直接提示，不会把错误数据发出去。 - 发送新行 ：默认勾选，自动在末尾追加
\r\n（多数设备指令的结束符）。 - 还有「发送后清空」和「清空输入」，按个人习惯选。
4.4 多条发送：把常用指令排好队
这是日常用得最多的一页。
- 一行一条指令 ：
[勾选] [序号] [内容] [描述] [删除]，序号跨条目连续递增。 - 点序号即发：每行左侧的序号按钮就是发送按钮，想调哪条点哪条，内容为空不会发出去，发送瞬间整行会高亮一下。
- 勾选才参与循环：只有勾上的条目会进入循环队列。
- 循环发送：设定周期（毫秒，默认 1000）后点「循环发送」，已勾选的指令会按周期轮转发出；点「停止循环」，或者直接关闭串口，都会立刻全部停下。
- 全局设置：「全局 HEX」「全局新行」两个开关可以一键「应用到全部」，省得一条条改。
- 导入 / 导出与客户端通用：导出的 INI 文件和客户端导出的格式逐字段一致，两边可以互相导入------你在网页上攒的指令，回头可以搬到客户端里；同事导出的指令集，你直接拖进来就能用。
4.5 自动回复：让它替你回话（核心亮点）
🌟 这是我最喜欢的功能，也是它和普通串口助手最大的区别------它能替你回话。
在这一页维护一张规则表，让工具扮演设备端，在你不在场的时候自动应答：
| 启用 | 匹配模板（收到） | 应答模板（回复） | 备注 | HEX |
|---|---|---|---|---|
| ☑ | HB? |
HB-OK |
心跳应答 | 关 |
| ☑ | D= |
ACK |
收到数据回执 | 关 |
| ☑ | FAULT |
CLEAR |
异常自恢复 | 关 |
| ☐ | SN? |
SN=DEMO-0001 |
查询序列号 | 关 |
（表里的指令是随手编的示例，实际填你自己的协议即可。）
- 匹配方式 ：设备发来的数据做包含匹配 ，按表格从上到下找，命中即停 。命中后立刻自动回复应答模板，并在接收区打一条青绿色的
[自动回复]记录。 - 只有同时填了匹配模板和应答模板 、并且勾选了启用的规则才生效。
- 支持 16 进制应答 ：勾上
HEX开关，应答内容会按十六进制解析后发出。二进制协议也能自动接话------这是网页版补齐客户端短板的一处。 - 导入 / 导出 CSV：文件只含三列（匹配模板、应答模板、备注），和客户端导出的格式完全一致，用 Excel 批量维护规则再导回来很方便。
典型用法：上位机程序还没写完，先用它模拟下位机应答，把链路先跑通；或者做压力测试时，让它自动"接话"，你只负责看日志。
上面那张截图里的 [自动回复] HB-OK，就是规则命中后它自己发出去的。
4.6 状态栏：连接状态一直摆在眼前
底部通栏，任何页签下都能看到：连接状态 （已连接 / 未连接，带颜色指示灯）、当前端口 、收发字节数 （RX / TX，可一键清零）、线路信号（DCD / DSR / CTS / RI，硬件握手有没有到位一眼就知道），最右侧是实时时钟。
4.7 帮助页：先看这个再动手
帮助页分两栏：
- 快速上手：四步走完从打开页面到收发数据；顶部还会实时告诉你当前环境是否满足条件------「安全上下文（HTTPS / localhost）」和「Web Serial API 可用」两个状态一眼可见，不满足的话直接给出该换什么浏览器。
- 关于：和客户端的差异说明、数据存放在哪里、免责声明，以及联系方式。下载桌面客户端的入口也放在这里。
五、你的配置和数据存在哪
这一点必须说清楚，因为它和客户端不一样：
- 串口参数、显示选项、发送历史、多条发送指令、自动回复规则，全部保存在你自己浏览器的本地存储里，改动即写入，下次打开原样恢复；
- 清除浏览器数据会丢，所以重要配置请用「导出 INI / 导出 CSV」单独备份一份------这两个文件同时也是和客户端交换配置的媒介；
- 本页面不上传任何数据，也没有后端服务。所有收发都发生在你的浏览器和串口设备之间，中间没有任何服务器参与，也不依赖网络。断网照样能用。
六、环境要求与常见问题
环境要求
- 浏览器：Chrome 89+、Edge 89+，或 360 / QQ 浏览器的极速模式（Chromium 内核）。Safari 与 Firefox 稳定版暂不支持------不是我不想做，是它们还没提供对应的浏览器接口。
- 地址 ：必须跑在 HTTPS 或
localhost下，这是浏览器对串口能力的硬性要求。不满足时页面顶部会直接给出提示。
🐛 关于问题反馈
这个网站是我自己一个人开发的，日常使用没什么大问题，但难免还有些没打磨到位的角落，可能存在一些小问题。
如有任何疑问，或者发现了 bug，欢迎直接发邮件给我：RiverPlus2026@outlook.com。 顺手附上浏览器版本、设备型号和操作步骤，我排查起来会快很多------个人开发的东西，就是靠这些真实反馈一点点磨顺的。
网页版里也放了同样的提示，在「帮助 → 关于」页的联系方式下方：
FAQ
Q：页面顶部提示"当前浏览器不支持 Web Serial API"？ A：换 Chrome 或 Edge（89 及以上），或者把 360 / QQ 浏览器切到极速模式。如果本来就在 Chromium 内核下还看到这个提示，检查一下地址是不是 HTTPS 或 localhost。
Q：点了「选择串口」找不到我的设备？ A：先确认 USB 转串口线插好了、驱动装好了（设备管理器里能看到）。浏览器只列出系统认得出来的设备。
Q：为什么下拉框里没有我上次选的串口？ A：故意的。端口列表不做记忆，每次都要手动挑一次，避免误连到别的设备上。
Q：端口显示 CH340 (1A86:7523)，我看不到 COM3，怎么知道连的是哪个？ A：浏览器不给网页系统串口号，只能靠芯片型号和厂商编号区分。如果你插了多个同型号的转串口线，建议一次只插一个，或者用客户端。
Q：收不到数据 / 数据是乱码？ A：先核对双方的波特率、数据位、停止位、校验位是否完全一致。中文乱码可以勾「16 进制显示」看原始字节；也可能是对方设备用的不是 UTF-8 编码。
Q：数据位为什么只有 7 和 8？停止位只有 1 和 2？ A：浏览器的接口就只开放了这些选项，属于平台限制，不是可配置项。
Q：我攒的指令和规则会丢吗？ A：不清浏览器数据就不会丢。但为了保险，重要配置建议导出一份 INI / CSV 放着。
Q：网页版导出的文件，客户端能导入吗？反过来呢？ A：都能。多条发送是 INI，自动回复是 CSV，两边格式对齐，可以自由互导。
Q：需要联网吗？ A：页面本身需要加载一次；加载完成后，串口通信完全在本地完成，不依赖网络，也不会上传任何数据。
七、怎么用上它
在线使用 ：com.riverplus.top/ ------ 打开就能用，记得用 Chrome / Edge（89+）。
桌面客户端下载 ：📦 夸克网盘（Windows，需 .NET Framework 4.8）
如果网页版帮到了你，或者你在用它的时候碰到了问题、想加点什么功能，都欢迎找我聊。一个小工具好不好用，靠的往往就是这些真实的反馈。
这个网站是我个人开发的，可能存在一些小问题。如有任何疑问或 bug 反馈，请联系邮箱 RiverPlus2026@outlook.com。
联系方式
- 🌐 个人主页：home.riverplus.top/
- 📝 技术专栏：juejin.cn/column/7678...
- 📮 邮箱：RiverPlus2026@outlook.com
------ 由 程序员江涛_RiverPlus 开发。一个小小的串口工具，多了一种打开方式。