Web Bluetooth API使网页能通过HTTPS安全上下文与BLE设备通信，需用户授权并精确设置服务过滤器以发现设备，连接后通过GATT协议读写服务与特性，并监听数据变化，但需处理设备断连、数据格式解析及浏览器兼容性问题，适用于物联网配置、教育编程、工业采集等轻量级交互场景。
Web Bluetooth API让浏览器直接与附近的低功耗蓝牙（BLE）设备进行通信，这简直是把互联网的触角延伸到了物理世界，让网页应用不再只是屏幕上的信息，而是能真正“摸”到现实中的硬件。它本质上提供了一套JavaScript接口，让开发者可以发现设备、连接、读写数据，甚至接收设备推送的通知。
要用Web Bluetooth API控制硬件设备，核心流程其实挺直观的，但具体操作起来，总会遇到一些意想不到的“小惊喜”。
首先，你得确保你的网页运行在安全上下文（HTTPS）下，并且浏览器支持Web Bluetooth。这是前提。
最开始，你需要请求用户授权来发现附近的设备。这通常通过
navigator.bluetooth.requestDevice()
async function connectToDevice() {
try {
// 1. 请求设备
const device = await navigator.bluetooth.requestDevice({
filters: [{
services: ['battery_service'] // 筛选只包含电池服务的设备
}],
optionalServices: ['heart_rate'] // 如果还需要心率服务，可以作为可选服务
});
console.log('已选择设备:', device.name);
// 2. 连接GATT服务器
const server = await device.gatt.connect();
console.log('已连接到GATT服务器');
// 3. 获取服务
const batteryService = await server.getPrimaryService('battery_service');
console.log('已获取电池服务');
// 4. 获取特性（Characteristic）
const batteryLevelCharacteristic = await batteryService.getCharacteristic('battery_level');
console.log('已获取电池电量特性');
// 5. 读取特性值
const value = await batteryLevelCharacteristic.readValue();
const batteryLevel = value.getUint8(0);
console.log('当前电池电量:', batteryLevel + '%');
// 如果需要写入，例如控制一个LED
// const ledService = await server.getPrimaryService('your_custom_led_service_uuid');
// const ledCharacteristic = await ledService.getCharacteristic('your_custom_led_characteristic_uuid');
// await ledCharacteristic.writeValue(new Uint8Array([1])); // 1表示开，0表示关
// 6. 监听通知（如果设备支持并需要）
// await batteryLevelCharacteristic.startNotifications();
// batteryLevelCharacteristic.addEventListener('characteristicvaluechanged', (event) => {
// const newBatteryLevel = event.target.value.getUint8(0);
// console.log('电池电量变化:', newBatteryLevel + '%');
// });
} catch (error) {
console.error('Web Bluetooth操作失败:', error);
}
}
// 触发连接的按钮点击事件
// document.getElementById('connectButton').addEventListener('click', connectToDevice);在
requestDevice
filters
services
name
namePrefix
optionalServices
filters
连接成功后，你会得到一个
BluetoothDevice
gatt
获取到服务和特性后，你就可以进行读写操作了。
readValue()
DataView
writeValue()
ArrayBuffer
TypedArray
startNotifications()
characteristicvaluechanged
这里有个小坑，很多时候，设备断开连接后，如果你不手动调用
device.gatt.disconnect()
gattserverdisconnected
谈到Web Bluetooth API，安全性与隐私绝对是绕不开的话题，而且我觉得这方面浏览器做得相当谨慎。毕竟，让一个网页直接接触物理硬件，潜在的风险可不小。
首先，最明显的一点是用户必须主动授权。你不能偷偷摸摸地扫描和连接设备。每次
navigator.bluetooth.requestDevice()
其次，它只能在安全上下文（Secure Contexts）中使用，这意味着你的网页必须通过HTTPS协议访问。本地开发时可以使用
localhost
再者，对设备的访问是受限的。Web Bluetooth API只能与低功耗蓝牙（BLE）设备通信，而不是传统的经典蓝牙。BLE设备通常设计用于特定功能，并且其GATT服务和特性都是明确定义的。网页只能访问设备上已声明的服务和特性，你不能随意地“探索”设备内部的所有功能。而且，在
requestDevice
optionalServices
还有一点，关于设备识别和追踪。Web Bluetooth API会使用一个临时的、不稳定的设备ID，而不是设备的真实MAC地址。这意味着即使同一个网站多次连接同一个设备，每次得到的设备ID也可能是不同的，这大大增加了追踪用户的难度，保护了用户的隐私。
当然，开发者自身也有责任。虽然浏览器做了很多安全限制，但如果你的应用需要处理敏感数据（比如医疗设备传输的数据），那么在应用层面进行数据加密和身份验证仍然是必要的。Web Bluetooth API提供的是一个通信通道，通道本身的安全性由浏览器和BLE协议保证，但通道上传输的数据内容，则需要开发者自行负责。我觉得这就像是提供了一辆坚固的卡车，但卡车里装什么货物，以及货物怎么打包，是货主（开发者）的责任。
调试Web Bluetooth应用，我感觉就像是在黑箱里摸索，尤其是在面对各种不同的硬件设备时，简直是“一设备一世界”。这里面有不少坑，有些是Web API层面的，有些则是硬件本身的脾气。
最大的一个“坑”可能就是设备找不到或连接失败。这可能是因为：
requestDevice
filters
解决策略：
chrome://bluetooth-internals/
device.gatt.connect()
getPrimaryService()
getCharacteristic()
gattserverdisconnected
另一个常见的“坑”是读写特性值时的数据格式问题。
readValue()
DataView
Uint8
Int16
writeValue()
ArrayBuffer
TypedArray
解决策略：
getUint8(0)
new Uint8Array([0x01])
最后，浏览器兼容性也是个问题。虽然主流桌面浏览器（Chrome、Edge、Opera）支持得不错，但移动端，尤其是iOS上的Safari，对Web Bluetooth API的支持非常有限，几乎不可用。这导致很多Web Bluetooth应用只能在桌面或Android设备上运行。
解决策略：
总的来说，调试Web Bluetooth需要耐心、细致，并且要善用浏览器提供的工具和日志。它不像传统的Web开发，你还需要对BLE协议和硬件行为有一定的了解。
我觉得Web Bluetooth API的独特魅力在于它降低了硬件交互的门槛。想象一下，你不需要安装一个庞大的原生应用，只需要打开一个网页，就能控制身边的智能设备。这在很多场景下都展现出巨大的潜力。
一个很明显的优势场景是物联网（IoT）设备的配置和监控。很多智能家居设备、传感器或者开发板（比如ESP32、micro:bit）都支持BLE。用Web Bluetooth API，你可以快速开发一个网页版的控制面板或者数据仪表盘。用户拿到设备后，只需要打开一个网页，就能完成设备的配对、参数设置，甚至实时查看传感器数据。这比要求用户下载一个特定App要方便太多了，尤其是对于那些只用一两次的设备。比如，一个智能花盆，你可能只在刚买回来时设置一下浇水频率，之后就很少管了，为这种场景专门开发和维护一个App，成本太高。
另一个我觉得非常有前景的场景是教育和创客领域。像micro:bit这样的编程教育板，本身就支持BLE。通过Web Bluetooth，学生可以直接在浏览器里编写JavaScript代码，然后通过网页连接到micro:bit，实时控制它，或者接收它的数据。这大大简化了开发环境的搭建，让孩子们能更专注于创意本身，而不是繁琐的工具链。我甚至看到过一些基于Web Bluetooth的在线编程平台，直接让网页变成了一个与硬件互动的IDE。
在工业或商业应用中，Web Bluetooth API也能发挥作用。例如，一些工业传感器、条码扫描枪、或者特定的测量工具，它们可能通过BLE与上位机通信。如果能用一个Web应用来作为这些设备的配置工具或数据采集前端，那么部署和维护成本会大大降低。想象一下，一个仓库管理员只需要打开一个内部网页，就能用手持设备扫描库存，并将数据实时同步到云端，而无需安装任何软件。
还有一些临时性的、轻量级的交互场景。比如，一个展会上的互动装置，或者一个简单的健康监测设备（如体温计、心率带），它们的数据可以实时传输到一个网页上进行展示或记录。用户无需安装任何东西，即用即走，非常方便。
当然，Web Bluetooth API并非万能。它有其局限性，比如传输速率相对较低，不适合大量数据传输；也不是所有蓝牙设备都支持BLE。但对于那些低功耗、数据量不大、需要与Web生态无缝衔接的场景，Web Bluetooth API无疑提供了一条极具吸引力的路径。它让硬件与软件的边界变得模糊，让更多人能够参与到物理世界的交互设计中来。
以上就是如何用Web Bluetooth API控制硬件设备？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
411
收藏
