Web Bluetooth API需HTTPS环境、用户手势触发且浏览器支持；通过requestDevice选择设备，gatt.connect建立连接，getPrimaryService获取服务，getCharacteristic读写特征值，并用startNotifications监听变化。
如果您尝试在网页中直接访问蓝牙设备，但浏览器无法发现或连接目标设备，则可能是由于Web Bluetooth API未被正确调用或环境不满足要求。以下是实现此功能的具体步骤：
一、确认浏览器与运行环境支持
Web Bluetooth API仅在部分现代浏览器的特定环境下可用，必须确保当前环境满足安全与兼容性前提。该API要求页面通过HTTPS提供服务（本地开发时localhost除外），且用户主动触发连接行为（如点击按钮），不能自动启动。
1、打开Chrome浏览器（版本89及以上）或Edge（基于Chromium的最新稳定版）。
2、访问您的网页，确认地址栏显示https://开头，或为http://localhost或http://127.0.0.1。
立即学习“前端免费学习笔记（深入）”；
3、在开发者工具控制台中输入navigator.bluetooth，若返回Bluetooth对象则表示API已启用；若报错undefined，说明浏览器不支持或未启用。
二、请求并选择蓝牙设备
调用navigator.bluetooth.requestDevice()方法可弹出系统级设备选择界面，用户需手动选取目标设备。该操作必须由用户手势（如click事件）触发，不可在页面加载时静默执行。
1、在HTML中添加一个按钮元素：。
2、为按钮绑定点击事件，在事件处理函数中调用navigator.bluetooth.requestDevice()，传入{ acceptAllDevices: true }或指定filters参数缩小范围。
3、若用户选择设备，Promise将解析为BluetoothDevice实例；若取消或无设备匹配，则抛出NotFoundError或SecurityError异常。
三、连接GATT服务器并获取服务
成功获取设备后，需调用device.gatt.connect()建立低功耗蓝牙GATT连接。连接完成后，才能访问设备暴露的服务、特征值和描述符。
1、检查设备对象的gatt属性是否为非null。
2、调用device.gatt.connect()，等待其返回的Promise完成。
3、使用device.gatt.getPrimaryService(serviceUUID)获取指定UUID的服务，例如"battery_service"或自定义128位UUID字符串。
四、读取与写入特征值
GATT服务中的特征值（Characteristic）是数据交互的基本单元。读取需调用characteristic.readValue()，写入需使用characteristic.writeValue()，二者均返回Promise。
1、调用service.getCharacteristic(characteristicUUID)获取目标特征值对象。
2、对可读特征执行characteristic.readValue()，结果为DataView对象，需按协议解析字节序列。
3、对可写特征执行characteristic.writeValue(data)，其中data必须为ArrayBuffer或TypedArray（如Uint8Array）。
五、监听特征值变化
对于支持通知（Notify）或指示（Indicate）的特征值，可通过characteristic.startNotifications()开启实时监听，并绑定characteristic.addEventListener('characteristicvaluechanged', handler)响应数据更新。
1、确认特征值的properties包含notify或indicate（可通过characteristic.properties查看）。
2、调用characteristic.startNotifications()启用通知机制。
3、使用characteristic.addEventListener('characteristicvaluechanged', e => { ... })捕获每次值变更事件，从e.target.value提取最新DataView。
以上就是html5访问蓝牙设备_使用Web Bluetooth API连接蓝牙【指南】的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1605777.html
微信扫一扫 
支付宝扫一扫 
