WebSerial调用getPorts()后打开串口失败及Readable/Writable异常问题

问题详情 #

首次通过弹窗授权调用WebSerial接口时功能正常：

port = await navigator.serial.requestPort();            
await port.open({ baudRate: 9600 });

但后续尝试通过getPorts()获取已授权端口并重新连接时，抛出DOM异常：

Uncaught (in promise) DOMException: Failed to execute 'open' on 'SerialPort': Failed to open serial port.

重连代码实现：

await navigator.serial.getPorts().then((ports) => {
    if(ports.length>0){
        port = ports[0]; 
        port.open({ baudRate: 9600 });              
    }
}); 

场景与环境 #

• 业务需求：用户首次通过弹窗选择COM口连接，后续无需弹窗直接重连
• 浏览器差异：问题仅出现在Chrome v.126.0.6478.128，Firefox v.128.0中未复现

SerialPort 对象差异对比 #

• 首次调用requestPort()返回的对象：

  SerialPort {onconnect: null, ondisconnect: null, readable: ReadableStream, writable: WritableStream}
  

• 后续调用getPorts()返回的对象：

  SerialPort {onconnect: null, ondisconnect: null, readable: null, writable: null}
  

问题根因与解决方案 #

2024-08-10 排查确认：
问题出在CH340芯片的USB-Serial适配器驱动上——Windows自动安装的驱动与Chrome的WebSerial API存在兼容性问题，导致端口对象无法正常初始化读写流。

替换为CH340原厂驱动后，问题彻底解决：

• getPorts()返回的SerialPort对象恢复正常：

  SerialPort {onconnect: null, ondisconnect: null, readable: ReadableStream, writable: WritableStream}
  

• 可正常执行串口读写操作。

内容的提问来源于stack exchange，提问作者RobertIT