JavaScript_串口通信与硬件交互-js教程-PHP中文网

JavaScript_串口通信与硬件交互

紅蓮之龍

发布： 2025-11-23 22:48:05

原创

569人浏览过

答案：JavaScript通过Web Serial API实现串口通信，需Chrome 89+和HTTPS环境，用户触发连接后可读写串口数据。1. 使用navigator.serial.requestPort()选择设备；2. 调用port.open()设置波特率建立连接；3. 通过ReadableStream读取Uint8Array数据并解码；4. 利用WritableStream发送编码后的指令；5. 应用于物联网、教育平台及工业HMI等场景，需处理异常与重连。

javascript_串口通信与硬件交互

JavaScript 实现串口通信与硬件交互，主要依赖现代浏览器提供的 Web Serial API。这个 API 允许网页通过 JavaScript 与串行设备（如 Arduino、传感器、PLC 等）直接通信，无需安装额外插件或本地程序。

Web Serial API 基础

Web Serial API 是目前在 Chrome 及基于 Chromium 的浏览器中支持的一项功能，适用于需要与微控制器或嵌入式设备通信的 Web 应用。

使用前需确保：

浏览器为 Chrome 89 或更高版本
网站运行在 HTTPS 环境下（本地开发可使用 localhost）
用户主动触发设备连接（如点击按钮）

请求并连接串口设备

通过 navigator.serial.requestPort() 方法可以弹出设备选择框，让用户选择要连接的串口设备。

立即学习“Java免费学习笔记（深入）”；

示例代码：

async function connect() {
  try {
    // 请求用户选择串口设备
    const port = await navigator.serial.requestPort();
    
    // 打开连接，设置波特率（需与硬件一致）
    await port.open({ baudRate: 9600 });

    console.log('设备已连接');
    return port;
  } catch (error) {
    console.error('连接失败:', error);
  }
}

登录后复制

读取与写入数据

连接成功后，可通过 ReadableStream 和 WritableStream 进行数据收发。

Revid AI

AI短视频生成平台

查看详情

读取数据：

async function readData(port) {
  const reader = port.readable.getReader();

  while (true) {
    const { value, done } = await reader.read();
    if (done) break;

    // value 是 Uint8Array 类型
    const text = new TextDecoder().decode(value);
    console.log('收到:', text);
  }

  reader.releaseLock();
}

登录后复制

发送数据：

async function sendData(port, message) {
  const encoder = new TextEncoder();
  const writer = port.writable.getWriter();

  await writer.write(encoder.encode(message));
  writer.releaseLock();
}

// 示例：发送指令到设备
sendData(port, 'LED_ON\n');

登录后复制