Web Serial API
注意：此功能在 專用 Web Workers 中可用。
Web Serial API 提供了一種允許網站讀取和寫入序列裝置的方式。這些裝置可能透過序列埠連線，也可能是模擬序列埠的 USB 或藍牙裝置。
概念與用法
Web Serial API 是一組允許網站與連線到使用者計算機的外圍裝置通訊的 API 之一。它提供了連線到作業系統要求透過序列 API 進行通訊的裝置的能力，而不是透過 WebUSB API 訪問的 USB，或者透過 WebHID API 訪問的輸入裝置。
序列裝置的例子包括 3D 印表機和微控制器，例如 BBC micro:bit 板。
介面
SerialExperimental-
提供用於從網頁查詢和連線序列埠的屬性和方法。
SerialPortExperimental-
提供對主機裝置上的序列埠的訪問。
其他介面的擴充套件
HTTP 標頭
Permissions-Policyserial指令-
控制當前文件是否允許使用 Web Serial API 與序列裝置通訊，這些裝置可以直接透過序列埠連線，或者透過模擬序列埠的 USB 或藍牙裝置。
示例
以下示例演示了 Web Serial API 提供的一些功能。
檢查可用埠
以下示例顯示瞭如何檢查可用埠，並允許使用者授予其訪問其他埠的許可權。
connect 和 disconnect 事件允許網站在裝置連線或斷開系統時做出響應。然後呼叫 getPorts() 方法來檢視網站已獲得訪問許可權的已連線埠。
如果網站沒有訪問任何已連線埠的許可權，它必須等到使用者啟用才能繼續。在本示例中，我們使用按鈕上的 click 事件處理程式來完成此任務。將過濾器傳遞給 requestPort()，其中包含 USB 供應商 ID，以將顯示給使用者的裝置集限制為僅由特定製造商製造的 USB 裝置。
js
navigator.serial.addEventListener("connect", (e) => {
// Connect to `e.target` or add it to a list of available ports.
});
navigator.serial.addEventListener("disconnect", (e) => {
// Remove `e.target` from the list of available ports.
});
navigator.serial.getPorts().then((ports) => {
// Initialize the list of available ports with `ports` on page load.
});
button.addEventListener("click", () => {
const usbVendorId = 0xabcd;
navigator.serial
.requestPort({ filters: [{ usbVendorId }] })
.then((port) => {
// Connect to `port` or add it to the list of available ports.
})
.catch((e) => {
// The user didn't select a port.
});
});
從埠讀取資料
以下示例顯示瞭如何從埠讀取資料。外部迴圈處理非致命錯誤，建立一個新的讀取器，直到遇到致命錯誤並且 SerialPort.readable 變為 null。
js
while (port.readable) {
const reader = port.readable.getReader();
try {
while (true) {
const { value, done } = await reader.read();
if (done) {
// |reader| has been canceled.
break;
}
// Do something with |value|...
}
} catch (error) {
// Handle |error|...
} finally {
reader.releaseLock();
}
}
規範
| 規範 |
|---|
| Web Serial API # serial-interface |
瀏覽器相容性
載入中…