Blazor Hybrid App: Error "object DOMException" with Barcode Reader

16 views Asked by At

I'm developing a Blazor hybrid app where I'm trying to implement a barcode reader feature using the BlazorZXingJs library. However, I'm encountering an error that I'm struggling to resolve.

Problem: When I navigate to the /BarCodeReader page in my Blazor hybrid app, the barcode reader component is displayed, but it's not functioning correctly. Instead, I'm seeing an error in the browser console:

[chromium] [INFO:CONSOLE(87)] "BarcodeReader initilized with autodetect format", source: https://0.0.0.0/_content/BlazorZXingJs/MultiFormatReader.js (87)
[CameraManagerGlobal] Connecting to camera service
[chromium] [INFO:CONSOLE(253)] "[object DOMException]", source: https://0.0.0.0/_content/BlazorZXingJs/MultiFormatReader.js (253)

Code: Here's the relevant code snippet from my Blazor page (BarCodeReader.razor):

@using EyePeakBlazorSharedUI.Pages.Interface
@using Microsoft.JSInterop
@using Xamarin.Essentials
@using BlazorZXingJs

@inject IJSRuntime JSRuntime
@inject IStorage StorageManager
@inject GlobalInfo globalInfo 
@inject NavigationManager NavigationManager

<h4>BarCodeReader</h4>

<MultiFormatReader VideoWidth="300"
                   VideoHeight="200"
                   OnBarcodeRead="BarcodeRead">

    <VideoForbidden>
        <h4>no permission for videodevice</h4>
    </VideoForbidden>

    <NoVideoDevices>
        <h4>no devices available</h4>
    </NoVideoDevices>
</MultiFormatReader>

<h4>@LocalBarcodeText</h4>

@code {

    private string? LocalBarcodeText;

    protected override async void OnInitialized()
    {
        base.OnInitialized();
        await requestCamera();
    }

    public async Task requestCamera()
    {
        await Permissions.RequestAsync<Permissions.Camera>();
    }

    private void BarcodeRead(string code)
    {
        LocalBarcodeText = code;
    }
   
}

Additional Details:

I'm using Xamarin.Essentials to request camera permissions. The OnBarcodeRead event handler is supposed to update the LocalBarcodeText property with the scanned barcode.

I'm using a sharedLibrary to transfer this code to my blazor web and blazor hybrid. It works on the web but in the android it doesn't, i tried all other libraries from zxing and even quaggejs and still didnt work.

0

There are 0 answers