STM32WBA Web Bluetooth® App Interfaces

Two GitHub pages hosting the web app are available:

• Web Bluetooth® HOME PAGE.
• Web Bluetooth® STM32WB.

No installation is required to use it this way.

Introduction

This is a web interface created with React 18 and Bootstrap 5.
This web interface uses Web Bluetooth® APIs to establish a Bluetooth® LE connection and exchange data with an STM32WBA board.

Here is the list of STM32WBA applications supported by this Bluetooth® web application:

• Peer To Peer Server
• Peer To Peer Router
• HeartRate
• Firmware Update Over The Air
• Data Throughput
• Health Thermometer
• Electrocardiogram
• BLE OEMiROT FOTA
• Doorlock
• Continuous Glucose Monitoring
• Blood Pressure
• Running Speed and Cadence
• Weight Scale
• AI Fan Control
• Solar Panel Demo

Example of the interface when a connection is established with Firmware Update Over The Air application and HeartRate application

Setup

Hardware requirements

To use the web interface, the following STM32WBA board is necessary .

• NUCLEO-WBA5x

A PC or a smartphone is required to open the web interface in a browser.

Software requirements

For more information about STM32CubeWBA Software Architecture click here

Refer to UM2237 to learn how to install and use STM32CubeProgrammer.

For more information about Bluetooth® LE please refer to the STMicroelectronics Wiki.

User's guide

Peer To Peer Server

The P2P Server application demonstrates a bidirectional Bluetooth® LE communication between a client and a server. The P2P Server interface proposes a set of buttons to interact with the connected device. A reboot panel is available only if a P2P Server service with the reboot OTA characteristic is detected on the device (see the Firmware Update Over The Air section to have more information related to OTA).

Requirements

Example with the NUCLEO-WBA5x board.

BLE_p2pServer binary file has to be flashed in the microcontroller.

Follow the next steps to learn how to use the application P2P Server

Step 1. Power on the STM32WBA board with the P2P Server application flashed and activate Bluetooth® on your machine.
Step 2. Open this web page in your browser.
Step 3. Click the Connect button, select P2PS_WBAxx in the device list, and click Pair.

Step 4. Click P2P Server to show the interface and read the tooltips.
You are now connected.
You can now interact with the connected device.

For more information about this application, please refer to STM32WBA P2P Server.

Firmware Update Over The Air (OTA)

The Firmware Update Over The Air (OTA) application allows a remote device to update the current application.

Requirements

Example with the NUCLEO-WBA5x board.

The BLE_ApplicationInstallManager application, associated to a Bluetooth® LE application embedding OTA service, manages the firmware update over the air of a Bluetooth® LE application.

The BLE_ApplicationInstallManager application must run with Bluetooth® LE applications embedding OTA service like: BLE_HeartRate_ota or BLE_p2pServer_ota applications.

BLE_ApplicationInstallManager is loaded at the memory address 0x08000000. BLE_HeartRate_ota or BLE_p2pServer_ota application is loaded at the memory address 0x08006000.

Follow the next steps to learn how to use the application Firmware Update Over The Air.

Step 1. Power on the STM32WBA board with the OTA application flashed and enable Bluetooth® on your machine.
Step 2. Open this web page in your browser.
Step 3. Click the Connect button, select your device from the list, and click Pair.
You are now connected.
Step 4. Choose between updating the User Configuration Data and the Application.
Step 5. Select the binary to be downloaded. Step 6. (Optional) Choose the first sector address from which the file will be written.
Step 7. Click the Upload button and wait for the disconnection.

Congratulations, the new Application/Wireless stack is running and can be connected.

For more information about this application, please refer to STM32WBA FUOTA.

HeartRate

The HeartRate application measures heart rate data and other information like the body sensor location and the energy expended. The HeartRate interface proposes a set of buttons and text input to interact with the connected device and a chart displaying the heart rate data received. A reboot panel is available only if a HeartRate service with the reboot OTA characteristic is detected on the device (see the Firmware Update Over The Air section to have more information related to OTA).

Requirements

Example with the NUCLEO-WBA5x board.

BLE_HeartRate binary file has to be flashed in the microcontroller.

Follow the next steps to learn how to use the application HeartRate

Step 1. Power on the STM32WBA board with the HeartRate application flashed and activate Bluetooth® on your machine.
Step 2. Open this web page in your browser.
Step 3. Click the Connect button, select HRSTM in the device list, and click Pair.
You are now connected.
Step 4. Click HeartRate to show the interface and read the tooltips.
You can now interact with the connected device.

For more information about this application, please refer to STM32WBA Heart Rate.

Data Throughput

The Data Throughput application measures the upload (data transfer from web interface to the connected device) and download (data transfer from the connected device to the web interface) throughput between the web app and the connected device. The Data Throughput interface proposes two panels, one to display the uploaded data and the other the downloaded data. Each panel has a chart of the data throughput and a button to reset the chart, the upload panel has also a button to start or stop the uploading of data.

Requirements

Example with the NUCLEO-WBA5x board.

BLE_DataThroughput binary file has to be flashed in the microcontroller.

Follow the next steps to learn how to use the application Data Throughput

Step 1. Power on the STM32WBA board with the Data Throughput application flashed and activate Bluetooth® on your machine.
Step 2. Open this web page in your browser.
Step 3. Click the Connect button, select DT_SERVER in the device list, and click Pair.
You are now connected.
Step 4. Click Data Throughput to show the interface and read the tooltips.
You can now interact with the connected device.

For more information about this application, please refer to STM32WBA Data Throughput.

Peer To Peer Router

The P2P Router application demonstrates STM32WBA acting at the same time as both: Bluetooth® LE central and peripheral, GATT server and client.

P2P Router application scans to connect to P2P Server devices and accept connection of ST Web Bluetooth® app. It will route Bluetooth® LE messages received from both side.

Requirements

Example with one NUCLEO-WBA5x board as a P2P Router, two NUCLEO-WBA5x and one P-NUCLEO-WB55 boards as P2P Server.

You need a P2P Router running on a STM32WBA5x and at least another STM32WBAxx / STM32WB Nucleo board to run a P2P Server application.

Follow the next steps to learn how to use the application P2P Router

Step 1. Power the P2P Router board with the P2P Router application flashed and power the other boards with the P2P Server applications.
Step 2. Activate Bluetooth® on your machine.
Step 3. Open this web page in your browser.
Step 4. Click the Connect button, select P2PR_WBAxx in the device list, and click Pair.
You are now connected.
Step 5. Click P2P Router to show the interface and click the Start button. You can now interact with the connected device.
Step 6. Power up to seven P2P Server devices near the P2P Router device.
Step 7. On each click of B1, the P2P Router will scan and then connect to a surrounding P2P Server device.
Step 8. On the Web Bluetooth® interface you can see devices appearing.

Step 9. On a P2P Server device, a click on B1 sends a notification to the P2P Router. This notification message is forwarded to the smartphone and displayed on the interface.

Step 10. On the Web Bluetooth® interface, click the Light button to write a message to the corresponding P2P Server device. This write message is first sent to the P2P Router and then routed to its destination.

For more information about this application, please refer to STM32WBA P2P Router.

Health Thermometer

The Health Thermometer Profile is used to enable a data collection device to obtain data from a thermometer sensor that exposes the Health Thermometer Service.

This specification is compatible with any Bluetooth® core specification host [3] that includes the Generic Attribute Profile (GATT) specification and the Bluetooth® Low Energy Controller specification.

Requirements

Example with the NUCLEO-WBA5x board.

BLE_HealthThermometer binary file has to be flashed in the microcontroller.

Follow the next steps to learn how to use the application Health Thermometer

Step 1. Power on the STM32WBA board with the Health Thermometer application flashed and activate Bluetooth® on your machine.
Step 2. Open this web page in your browser.
Step 3. Click the Connect button, select HT_xx in the device list, and click Pair.
You are now connected.
Step 4. Click Health Thermometer to show the interface.

For more information about this application, please refer to STM32WBA Health Thermometer.

Troubleshooting

Caution : Issues and the pull-requests are not supported to submit problems or suggestions related to the software delivered in this repository. This example is being delivered as-is, and not necessarily supported by ST.

For any other question related to the product, the hardware performance or characteristics, the tools, the environment, you can submit it to the ST Community on the STM32WBA MCUs related page.