The document discusses the Physical Web and how it allows Bluetooth Low Energy devices to broadcast information that can be detected by nearby smartphones and browsers. It describes how the Eddystone-URL beacon format and Web Bluetooth API allow devices to publish data and services that browsers can access. It provides examples of using these to create a temperature sensor that broadcasts readings to nearby phones and receives them in the browser using the Web Bluetooth API and Bluetooth Low Energy GATT profile.

1. Physical Web
Oder: Wenn der Browser mit dem Toaster….
Web Montag Kassel, 27. März 2017
Jens Siebert (@jens_siebert)

2. Der „smarte“ Toaster…

6. ?

7. Eddystone-URL (Beacon)*
Web Bluetooth**
Physical Web
**Funktioniert zurzeit nur mit Chrome für Android, Mac, iOS und Linux. Windows ab Frühjahr 2017.
*Funktioniert mit Android (ab 4.4) und iOS.

8. Bluetooth LE Generic Access Profile (GAP)
- Eddystone-URL
- Services

9. Bluetooth LE Generic Attribute Profile (GATT)
- Characteristics
- Data

10. Bluetooth LE Generic Attribute Profile (GATT)
Profile
Service
Service
Characteristic
Characteristic
Characteristic
Characteristic
GATT
Environmental Sensing
Battery Service
Temperature
Pressure
Humidity
Battery Level

11. if (!navigator.bluetooth) {
return Promise.reject('Bluetooth API not available');
}
return navigator.bluetooth.requestDevice({
acceptAllDevices: true,
optionalServices: ['environmental_sensing']
})
.then(device => device.gatt.connect())
.then(server => server.getPrimaryService('environmental_sensing'))
.then(service => service.getCharacteristic('temperature'))
.then(characteristic => characteristic.addEventListener('characteristicvaluechanged',
handleTemperatureValueChanged))
.then(characteristic => characteristic.startNotifications())
.catch(error => console.log(error));
function handleTemperatureValueChanged(event) {
let characteristic = event.target;
console.log(characteristic.value.getInt16(0, true) / 100 + " °C");
}
Wichtig: https://...

12. Android:
System-Einstellungen → Google → Nearby
Chrome:
Einstellungen → Datenschutz → Physical Web

13. Demo Time!
Adafruit Feather 32u4 Bluefruit LE
- Arduino-kompatibel
- Bluetooth LE (nRF51)
BMP280 Sensor
- Temperatur
- Luftdruck
HTU21D Sensor
- Luftfeuchtigkeit

14. Weitere Infos
• Physical Web: https://google.github.io/physical-web/
• Web Bluetooth: https://webbluetoothcg.github.io/web-bluetooth/
• Web Bluetooth Examples: https://googlechrome.github.io/samples/web-bluetooth/
• Bluetooth LE GATT: https://www.bluetooth.com/specifications/generic-attributes-overview
• Code (Web & Arduino): https://bitbucket.org/jenssiebert/wmksphysicalweb
• Slides: http://www.slideshare.net/JensSiebert1/physical-web-73663054

15. Kleiner Hinweis
Puck.js – JavaScript + Bluetooth LE =
http://www.espruino.com/Puck.js