C# Blazor BlazorWorker 를 이용해 Background Service 처리하기

BlazorWorker 를 이용해 Background Service 처리하기

 

BlazorWorker 는 Blazor 에서 Background Service 를 이용해 주기적으로 체크가 필요한 서비스를 만들기 위해
사용되는 라이브러리 입니다.

Timer 를 사용하게되면 화면에서 JavaScript 호출하게되면 Timer 가 멈추는 증상이 발생됩니다.
싱글쓰레드로 동작하기 때문인데 BlazorWorker 는 이를 해결할 수 있게 해줍니다.

https://github.com/Tewr/BlazorWorker

GitHub - Tewr/BlazorWorker: Library for creating DotNet Web Worker threads/multithreading in Client side Blazor

 

1. Tewr.BlazorWorker.BackgroundService 설치

 

2. Program.cs 코드추가

builder.Services.AddWorkerFactory();

using Blazor.BlazorWorkerTest;

using BlazorWorker.Core;

using Microsoft.AspNetCore.Components.Web;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");

builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
builder.Services.AddWorkerFactory(); // 추가

await builder.Build().RunAsync();

 

3. Global using 처리

_Imports.razor 파일에 아래 항목 추가

@using BlazorWorker.BackgroundServiceFactory
@using BlazorWorker.Core
@inject IWorkerFactory workerFactory

 

4. Service 정의

Background 로 처리할 Service 를 정의합니다.

    public class TestService
    {
        public int TestMethod()
        {
            int i = 0;
            Console.WriteLine("Starting long running task");
            DateTime endTime = DateTime.UtcNow.AddSeconds(10);
            while (DateTime.UtcNow < endTime)
            {
                i++;
                Console.WriteLine("Task.Delay(100) - " + i.ToString());
                Task.Delay(1000);
            }
            Console.WriteLine("Finished long running task");

            return i;
        }
    }

위는 단순히 콘솔 창에 로그를 찍는 서비스입니다.

 

5. Background Service 사용하기

아래처럼 화면에서 사용합니다.

@page "/"

@using Blazor.BlazorWorkerTest.Services
@using BlazorWorker.BackgroundServiceFactory
@using BlazorWorker.Core
@inject IWorkerFactory workerFactory
@inject IJSRuntime JS
<PageTitle>Index</PageTitle>

<button @onclick=OnClick>Do long running</button>
<button @onclick=Alert>Do alert</button>

@code {
   
    public async Task OnClick(EventArgs _)
    {
        var worker = await workerFactory.CreateAsync();
        var service = await worker.CreateBackgroundServiceAsync<TestService>();
        var result = await service.RunAsync(s => s.TestMethod());
    }

    void Alert()
    {
        JS.InvokeVoidAsync("alert", "test");
    }
}

위 코드를 보면 알수 있듯이 버튼 클릭시 TestService 를 등록하여 실행하게됩니다.

TestService 가 동작하여 로그를 찍게되는데 Alert 버튼을 클릭하게되어도 TestService 에 영향이 없음을 알수 있습니다.