Home

Awesome

Blazor.WebBluetooth

Installation

  1. Install the NuGet package KeudellCoding.Blazor.WebBluetooth.
  2. Add the following lines to _Imports.razor
@using KeudellCoding.Blazor.WebBluetooth
@using KeudellCoding.Blazor.WebBluetooth.Models
  1. Register Service
using KeudellCoding.Blazor.WebBluetooth;

builder.Services.AddWebBluetooth();
using KeudellCoding.Blazor.WebBluetooth;

services.AddWebBluetooth();

Usage Example

@page "/"
@inject WebBluetoothControllerService __WebBluetooth

<div>
    @if (isAvailable.HasValue) {
        if (isAvailable == true) {
            <button @onclick="connect">Connect</button>
            <button @onclick="disconnect">Disconnect</button>

            <br />
            
            @if (connectedDevice != null) {
                <span>@connectedDevice.Id</span><br /><span>@connectedDevice.Name</span>
            }
        }
        else {
            <b>Bluetooth not available!</b>
        }
    }
    else {
        <i>Loading Bluetooth...</i>
    }
</div>

@code {
    private bool? isAvailable = null;
    private Device connectedDevice;

    protected override async Task OnAfterRenderAsync(bool firstRender) {
        if (firstRender) {
            isAvailable = await __WebBluetooth.IsAvailableAsync();
            StateHasChanged();
        }
    }
    
    private async Task connect() {
        connectedDevice = await __WebBluetooth.RequestDeviceAsync(new RequestDeviceQuery() {
            Filters = new List<Filter> {
                new Filter() {
                    Services = new List<string> {
                        "<<SERVICE_ID_OR_NAME>>"
                    }
                }
            }
        });
        StateHasChanged();
    }
    private async Task disconnect() {
        if (connectedDevice == null) return;
        await __WebBluetooth.DisconnectAsync(connectedDevice);
    }
}

Notes

  1. I programmed this project based on EngstromJimmy and adapted it for my personal needs. Maybe it will help others too.
  2. Currently, WebBluetooth is not yet supported by all browsers. A current implementation status can be found here.
  3. WebBluetooth is a feature that is still under development. There may still be spontaneous massive changes in the JavaScript API that would result in this project no longer working.