Serial - 提供了从网页查找和连接串口的属性和方法

安全上下文
该功能仅在部分或所有支持的浏览器中的安全上下文(HTTPS)中可用。

Serial 接口是 Web Serial API 的接口,提供了从网页查找和连接串口的属性和方法。

方法

Serial.requestPort()

返回一个 Promise,它解析为表示用户选择的设备的 SerialPort 的实例,如果没有选择设备,则拒绝解析。必须在用户激活的情况下调用此方法。

Serial.getPorts()

返回一个 Promise,它解析为一个 SerialPort 个对象组成的数组,这些对象表示连接到原始设备有权访问的主机的串口。

事件

通过 SerialPort 的事件冒泡, Serial 可以获得以下事件:

SerialPort connect 事件

当端口已连接到设备时触发的事件。

SerialPort disconnect 事件

当端口与设备断开连接时触发的事件。

实例

以下实例显示站点如何检查可用端口并允许用户授予其访问其他端口的权限。

connectdisconnect 事件添加加载事件侦听器,以便站点可以在设备与系统连接或断开连接时做出反应。然后调用 getPorts() 方法来查看站点已经访问的已连接端口。

如果该站点无法访问任何连接的端口,则必须等到用户激活后才能继续。在本例中,我们在此任务的按钮上使用了一个 click 事件处理程序。过滤器通过 USB 供应商 ID 传递给 questPort(),以便将向用户显示的设备集限制为仅由特定制造商制造的 USB 设备。

navigator.serial.addEventListener('connect', (e) => {
  // 连接到 `e.target` 或将其添加到可用端口列表。
});

navigator.serial.addEventListener('disconnect', (e) => {
  // 从可用端口列表中删除 `e.target`。
});

navigator.serial.getPorts().then((ports) => {
  // 在页面加载时使用 `ports` 初始化可用端口列表。
});

button.addEventListener('click', () => {
  const usbVendorId = ...;
  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
    // 连接到 `port` 或将其添加到可用端口列表中。
  }).catch((e) => {
    // 用户未选择端口。
  });
});

规范

规范
Web Serial API # serial-interface

桌面浏览器兼容性

暂无兼容数据