blazorrazor-class-library

Service in Blazor


How to make a service in balzor that can work in every module of the project including in RCL. For example: Have a project: ServiceTestBlazorServerApp, Few RCLs: MainRazorClassLibrary, UserRazorClassLibrary and so on... Service:

public class UserService
{
    private User? _CurrentUser;

    public User? CurrentUser
    {
        get { return _CurrentUser; }
        set { _CurrentUser = value; }
    }
    
    public class User
    { 
        public string Name { get; set; }
        public Guid SessionId { get; set; }
    }
}

I need service to be active in every module and if one module makes a change in Users data the change should be visible to every other module. But for each individual session data should be independent, clients should have their own sessions. I want the service to be usable the same way as it would be usable if I had just one project ServiceTestBlazorServerApp.


Solution

  • Put your UserService in a base library.

    I've added an event and a setter method to control updating CurrentUser.

    namespace Shared;
    public class UserService
    {
        public event EventHandler? UserChanged;
    
        public User? CurrentUser { get; private set; }
    
        public void UpdateUser(User user)
        {
            this.CurrentUser = user;
            this.UserChanged?.Invoke(this, new EventArgs());
        }
    
        public class User
        {
            public string Name { get; set; } = "-- Not Set --";
            public Guid SessionId { get; set; }
        }
    }
    

    You can then reference the base library and use it in your Razor libraries.

    Note the injected service, and IDisposable implementation.

    @using Shared;
    
    @inject UserService UserService
    @implements IDisposable
    
    <h3>UserComponent</h3>
    
    <div>User Name: @UserService.CurrentUser</div>
    
    @code {
        protected override void OnInitialized()
            => this.UserService.UserChanged += this.OnUserChanged;
    
        public void Dispose()
            => this.UserService.UserChanged -= this.OnUserChanged;
    
        private void OnUserChanged(object? sender, EventArgs e)
            => this.StateHasChanged();
    }
    

    You then reference the shared library and add the Service to the actual deployment project:

    // Add services to the container.
    builder.Services.AddRazorPages();
    builder.Services.AddServerSideBlazor();
    builder.Services.AddSingleton<WeatherForecastService>();
    builder.Services.AddScoped<UserService>();
    

    enter image description here