Announcing Web Serial Support in Firefox

宣布 Firefox 支持 Web Serial

Support for Web Serial in Firefox 151 for Desktop Firefox can now connect directly to microcontrollers, development boards, 3D printers, power meters, and other serial-connected hardware from the web. Starting in Firefox 151 for Desktop, support for the Web Serial API allows web applications to communicate with compatible devices without requiring native software. 从 Firefox 151 桌面版开始，Firefox 现在可以直接从网页连接到微控制器、开发板、3D 打印机、功率计以及其他通过串口连接的硬件。通过对 Web Serial API 的支持，Web 应用程序无需安装原生软件即可与兼容设备进行通信。

Web Serial compatible devices are popular among hobbyists, hardware hackers, educators, makers, and developers with use cases ranging from home automation to hardware prototyping and 3D printing. Web Serial support makes Firefox more useful for these kinds of projects. Web Serial 兼容设备在爱好者、硬件极客、教育工作者、创客和开发者中非常受欢迎，应用场景涵盖了从家庭自动化到硬件原型设计及 3D 打印的各个领域。Web Serial 的支持使 Firefox 在此类项目中变得更加实用。

One of the organizations that has demonstrated the value of Web Serial is Adafruit, a leader in open-source hardware and STEM education. They’ve made it quick and easy to install CircuitPython on their devices by delivering firmware over Web Serial. Then it’s straightforward to run Python programs on the device. Name your file code.py and, for most devices, the code can be installed by dragging-and-dropping the file onto the USB device. Your Python programs can interoperate with a web page over Web Serial using simple text-based I/O. Adafruit 是开源硬件和 STEM 教育领域的领导者，也是展示 Web Serial 价值的组织之一。他们通过 Web Serial 传输固件，使得在设备上安装 CircuitPython 变得快速且简单。之后，在设备上运行 Python 程序也十分直接：只需将文件命名为 code.py，对于大多数设备，只需将文件拖放到 USB 设备中即可完成安装。你的 Python 程序可以通过 Web Serial 使用简单的文本输入/输出与网页进行交互。

To install CircuitPython firmware with Firefox, we recommend using the Adafruit Web Serial Tool and not the OPEN INSTALLER method on the CircuitPython site. Here’s an example using an Adafruit ESP32-S2 based board where messages sent from web code can be directly displayed on the device over Web Serial. A video showing an example CircuitPython Web Serial project where a message is sent from a local web page using Web Serial to a device running a CircuitPython code.py file. 若要使用 Firefox 安装 CircuitPython 固件，我们建议使用 Adafruit Web Serial 工具，而不是 CircuitPython 网站上的 OPEN INSTALLER 方法。这里有一个使用 Adafruit ESP32-S2 开发板的示例，网页代码发送的消息可以通过 Web Serial 直接显示在设备上。视频展示了一个 CircuitPython Web Serial 项目示例，其中消息通过 Web Serial 从本地网页发送到运行 code.py 文件的设备。

We’ve collaborated with Adafruit to test Firefox’s implementation against real hardware workflows commonly used by this community. The result: Firefox is a more practical browser for programming and interacting with hardware directly using web technology. As an example of how you can combine Web Serial with electronics, Mozilla engineer Alex Franchuk created an amazingly fun and functional device that melds electronics and web editing. Check out the Page Playground. 我们与 Adafruit 合作，针对该社区常用的真实硬件工作流程测试了 Firefox 的实现。结果表明：Firefox 是一个更实用的浏览器，能够利用 Web 技术直接进行编程和硬件交互。作为如何将 Web Serial 与电子设备结合的示例，Mozilla 工程师 Alex Franchuk 创造了一个既有趣又实用的设备，将电子技术与网页编辑融为一体。欢迎查看 Page Playground。

The list of serial compatible devices includes Espressif ESP-based boards such as the popular ESP32 chips, Raspberry Pi Picos, 3D printers, LEGO devices, and many more. There are many tools for running your own code on these small affordable microcontroller boards, and with Web Serial it’s easier than ever to connect them to a computer and interact through a web-based user interface. 串口兼容设备列表包括基于乐鑫（Espressif）ESP 的开发板（如流行的 ESP32 芯片）、树莓派 Pico、3D 打印机、乐高设备等。目前有许多工具可以在这些小型且经济实惠的微控制器板上运行代码，而有了 Web Serial，将它们连接到计算机并通过基于 Web 的用户界面进行交互变得前所未有的简单。

What is Web Serial?

什么是 Web Serial？

Web Serial is a web API that allows a website to read and write to serial devices using JavaScript. See the MDN documentation for the details. While modern computers don’t typically include serial ports, serial devices connected to a USB port or paired via Bluetooth can advertise themselves as serial-capable devices so they appear as serial ports in the operating system. The Web Serial API lets developers use the web platform to communicate with these devices. For example, websites can control devices or deliver firmware without requiring native applications or installers. Web Serial 是一项 Web API，允许网站使用 JavaScript 对串口设备进行读写操作。详情请参阅 MDN 文档。虽然现代计算机通常不包含物理串口，但连接到 USB 端口或通过蓝牙配对的串口设备可以将自己声明为支持串口的设备，从而在操作系统中显示为串口。Web Serial API 让开发者能够利用 Web 平台与这些设备进行通信。例如，网站可以在无需原生应用程序或安装程序的情况下控制设备或分发固件。

Mozilla’s own Florian Quèze, who has experimented with many projects to measure power consumption, demonstrated how Web Serial could be used to read power data from an off-the-shelf USB power meter and display it in Firefox. Florian’s code can also export the data into the Firefox Profiler, making it easy to visualize and share power data. Here’s the page and GitHub repo. The screenshots below show the page in action and the data in the Firefox Profiler after recording the power usage of a light with three brightness modes. Mozilla 的 Florian Quèze 曾尝试过许多测量功耗的项目，他演示了如何使用 Web Serial 从现成的 USB 功率计读取功率数据并将其显示在 Firefox 中。Florian 的代码还可以将数据导出到 Firefox Profiler 中，从而轻松实现功率数据的可视化和共享。这是相关页面和 GitHub 仓库。下方的截图展示了该页面的实际运行情况，以及在记录了一盏具有三种亮度模式的灯的功耗后，Firefox Profiler 中显示的数据。

Home Assistant is another example. It’s a popular (and growing) open source project for home automation. The ESPHome project offers Home Assistant-compatible firmware for affordable ESP32 and similar devices which can be installed and configured over Web Serial in just a few clicks. Home Assistant 是另一个例子。这是一个流行且不断增长的家庭自动化开源项目。ESPHome 项目为经济实惠的 ESP32 及类似设备提供了兼容 Home Assistant 的固件，只需点击几下，即可通过 Web Serial 进行安装和配置。

Security and Privacy

安全与隐私

There are clear security and privacy concerns with allowing the web platform to read and write to hardware devices. Most importantly, with Web Serial, websites do not have visibility or access to serial ports until the user explicitly allows it. Ports are allowed on a per-site and per-port basis. The Web Serial API requires websites to call navigator.serial.requestPort(), which lets the user choose which port to allow access to, or disallow all access entirely. This means websites do not receive a list of connected devices and there is no useful fingerprinting information outside of the port the user selects. 允许 Web 平台读写硬件设备存在明显的安全和隐私隐患。最重要的是，使用 Web Serial 时，在用户明确授权之前，网站无法查看或访问串口。串口的访问权限是基于“每个站点”和“每个端口”进行管理的。Web Serial API 要求网站调用 navigator.serial.requestPort()，这让用户可以选择允许访问哪个端口，或者完全拒绝所有访问。这意味着网站不会获取已连接设备的列表，除了用户选择的端口外，也不会有任何有用的指纹识别信息。

To help users understand when and why a site requests access to a serial port, Firefox uses add-on gating which we introduced with our Web MIDI API implementation. Compared to other web permission prompts, this gives the user a more detailed explanation of what they’re allowing. The add-on gating prompts appear before the port selection prompt the first time a site requests port access. 为了帮助用户理解网站何时以及为何请求访问串口，Firefox 使用了我们在实现 Web MIDI API 时引入的“附加组件门控”（add-on gating）。与其他 Web 权限提示相比，这为用户提供了更详细的解释，说明他们正在授权的内容。当网站首次请求端口访问时，附加组件门控提示会出现在端口选择提示之前。

For organizations using Firefox Enterprise Policies, Web Serial is disabled by default. Administrators can explicitly allow or disallow Web Serial functionality across their organization using the DefaultSerialGuardSetting policy setting. 对于使用 Firefox 企业策略的组织，Web Serial 默认处于禁用状态。管理员可以使用 DefaultSerialGuardSetting 策略设置，在整个组织内明确允许或禁止 Web Serial 功能。

Standardization

标准化

While Web Serial still resides in the Web Incubator Community Group (WICG), we’re optimistic there’s a path to standardization given its scope and long-running incubation. We are pursuing standardizing the Web Serial API in the WHATWG in a new Workstream proposal and are excited to work with ecosystem partners and standards bodies to help shape access to peripherals on the web. 虽然 Web Serial 目前仍处于 Web 孵化器社区组 (WICG) 中，但考虑到其范围和长期的孵化过程，我们对其标准化前景持乐观态度。我们正在推动在 WHATWG 的新工作流提案中对 Web Serial API 进行标准化，并很高兴能与生态系统合作伙伴及标准机构合作，共同塑造 Web 端外设的访问方式。