Project 41, Hardware and performance

Bluetooth Device Dashboard

Pair a heart rate strap, watch or sensor and see live readings in the browser. No app to install. No device nearby? Use the demo mode.

Main API: Web Bluetooth
Services: Heart rate, battery, device info
Dependencies: None
Your browser: Checking

Device

Not connected

Heart rate

-- bpm

Average

Min and max

Battery

How it works

Ask for a deviceThe browser shows its own picker, filtered to devices with the heart rate service. The page only gets the one you choose.
SubscribeThe page connects to the GATT server and starts notifications on the heart rate characteristic.
DecodeEach notification is a few bytes. The first byte says if the value is 8 or 16 bit, then the reading follows.

const device = await navigator.bluetooth.requestDevice({
  filters: [{ services: ["heart_rate"] }], optionalServices: ["battery_service"],
});
const server = await device.gatt.connect();
const hr = await (await server.getPrimaryService("heart_rate"))
  .getCharacteristic("heart_rate_measurement");

hr.addEventListener("characteristicvaluechanged", (e) => {
  const v = e.target.value;                            // DataView
  const bpm = v.getUint8(0) & 1 ? v.getUint16(1, true) : v.getUint8(1);
  show(bpm);
});
await hr.startNotifications();