Web Serial API 允许现代浏览器（chrome 89+等）在用户授权下与串口设备通信，需httpS/localhost、用户手势触发、手动选择设备，流程为请求端口→打开配置→获取读写流→处理数据，注意粘包解析与异常捕获。
javaScript 本身不能直接操作串口设备，但现代浏览器（Chrome 89+、edge 110+、Opera 75+）支持 Web Serial API，允许网页在用户授权下与串口设备通信。它不是纯 js 底层能力，而是受严格安全限制的异步 Web API。
前提条件和限制
Web Serial API 只能在安全上下文（https 或 localhost）中使用；必须由用户手势（如点击按钮）触发请求权限；不支持后台运行或自动连接；仅适用于有 USB/UART 转串口芯片（如 CH340、CP2102、FTDI）的设备。
- 需要用户主动点击“连接串口”按钮才能调用
navigator.serial.requestPort() - 浏览器会弹出设备选择框，用户手动选中目标串口（如 “Arduino Uno”、“USB Serial Port”）
- 不支持 windows 的 COMx 名称直连，也不支持 linux 的 /dev/ttyUSB0 字符串匹配
基本连接与读写流程
典型流程是：请求端口 → 打开端口 → 配置参数 → 获取读写流 → 处理数据。
- 获取端口：
const port = await navigator.serial.requestPort(); - 打开并配置：
await port.open({ baudRate: 9600 });（支持波特率、dataBits、stopBits、parity 等） - 创建读取流：
const reader = port.readable.getReader();，用reader.read()循环读取 Uint8Array - 创建写入流：
const writer = port.writable.getWriter();，用writer.write(new TextEncoder().encode("ATrn")) - 记得关闭：
await port.close();，否则下次连接可能失败
处理接收到的数据（推荐方式）
避免阻塞，用 while(true) + await reader.read() 持续监听；用 TextDecoder 将字节转字符串；注意粘包——串口数据无天然分隔，需按协议解析（如以 n 结尾、固定长度、或自定义帧头帧尾）。
立即学习“Java免费学习笔记（深入）”；
- 示例解码逻辑：
const decoder = new TextDecoder(); const { value, done } = await reader.read(); if (!done) console.log(decoder.decode(value)); - 发送字符串前务必编码：
new TextEncoder().encode("Hello")，不能直接传字符串 - 读写过程需用 try/catch 捕获断开、权限丢失等异常
兼容性与备选方案
firefox 和 safari 目前不支持 Web Serial API；若需跨浏览器支持，可考虑桌面方案：electron（用 node-serialport）、Tauri（调用系统串口库）或通过本地 HTTP 代理（如用 python flask 暴露串口 API，网页 ajax 通信）。
基本上就这些。Web Serial API 不复杂但容易忽略安全模型和用户交互要求，关键在“用户触发 + 显式授权 + 流式处理”。