When debugging Blazor Server, Blazor WASM's invoke is jumping to Server side

Question

When debugging Blazor Server, Blazor WASM's invoke is jumping to Server side

Matěj Rada 40

I want to share the same data class between Blazor Server and Blazor WASM with the injection of DataSource in such a way that once registered for Server, it will use EntityFramework by DbContext, and once registered for WASM, it will use DbSet for remote Linq. But since I am debugging it from the same solution, WASM is not registering any services and instead my code is jumping into Blazor Server's registered Singleton. Once I remove registration from Server, Razor page with @inject will say that there is no service for such an injection. I have an unmodified sample Blazor server project generated by VisualStudio. I just added .NET Standard library with shared functionality and now I am trying to configure Services. On the server side everything working.

AgaveJoe 29,946 Reputation points

2024-02-24T00:04:15.5033333+00:00

The first step in debugging is reproducing the issue. It is very difficult to reproduce this issue without example code, steps to reproduce the problem, and your expected results.
Matěj Rada 40 Reputation points

2024-02-24T04:24:37.5033333+00:00

All I want to register interface IDataServiceFactory for two different Singleton. One for server side and one for WASM. Currently, any service registration in WASM is ignored and only server side services are being used in my WASM, when I am injecting by @inject in my Razor code. I've tried to bridge this by registering Singleton class directly in my WASM, but Razor would say that no service for this Singleton is registered ... Really whole scenario - i want implement custom Singleton service different for each environment, nothing more.

Rada Matěj 200

This:

using ANeT_Client;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using SharedData;
 
var builder = WebAssemblyHostBuilder.CreateDefault(args);
 
builder.Services.AddSingleton<IDataSourceFactory, DataSourceFactory>();
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri("http://localhost:5244/") });
 
await builder.Build().RunAsync();

@page "/counter"
@rendermode InteractiveAuto
@inject IDataSourceFactory dataSource
 
<PageTitle>Client Counter</PageTitle>
 
<h1>Client Counter</h1>

Is jumping into this:

using ANeT_Client.Pages;
using ANeT_Server;
using ANeT_Server.Components;
using Microsoft.Extensions.FileProviders;
using SharedData;
 
var builder = WebApplication.CreateBuilder(args);
 
builder.Services.AddSingleton<IDataSourceFactory, DataSourceFactory>();

So @inject is calling my server Singleton:

using SharedData;
using System.Reflection;
 
namespace ANeT_Server
{
    public class DataSourceFactory : IDataSourceFactory
    {
        public D Create<D>(int par1, string par2) where D : IFactoryableFromParameterType1

And direct Singleton for DataSourceFactor isn saying, that not service is registered ...

using ANeT_Client;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using SharedData;
 
var builder = WebAssemblyHostBuilder.CreateDefault(args);
 
builder.Services.AddSingleton<DataSourceFactory>();
 
await builder.Build().RunAsync();

@page "/counter"
@rendermode InteractiveAuto
@inject DataSourceFactory dataSource
 
<PageTitle>Client Counter</PageTitle>
 
<h1>Client Counter</h1>

This should be working, but because I am debugging WASM by running Blazor server with reference to it, it is obviously using Blazor server service of my singleton ...

AgaveJoe 29,946 Reputation points

2024-02-24T11:56:40.7833333+00:00

I have .NET 8 Blazor test applications that execute server side DbContext and populate the UI as well as and client side HTTP request that call server side REST end points.

Yes, that's correct. In a Blazor WebAssembly (WASM) application, you can use Entity Framework Core (EF Core) to define a DbContext and DbSet for your entities. When you perform LINQ queries against these DbSet instances in your Blazor WASM application, EF Core will translate these queries into HTTP requests to a backend server hosting the EF Core database context.

I'm not sure where you are getting this information but it is not true.
You could simply create a interface inherited by two different implementations. One implementation executes LINQ (server side) while the other makes HTTP requests (client side). In my opinion, this is not a good approach because you are forcing the data interface from a data access layer to be the same as a REST service and the UI which is never the use case.

Lastly, read the following to make sure you understand service lifetime in Blazor.

ASP.NET Core Blazor with Entity Framework Core (EF Core)
Matěj Rada 40 Reputation points

2024-02-24T12:08:59.9066667+00:00

Yes, I need to implement Remote.Linq Nuget package. I have created an interface inherited by two different applications as for my snippet I have already shown here. But the problem is still the same. When debugging Blazor server, only server registered Singleton is @inject into my WASM Razor page. Added service in my WASM is ignored and I cannot properly develop my application WASM during debugging ...

Rada Matěj 200

So, the problem is, that error occurred even before WASM builder creation: User's image

This is really just the template used from VisualStudio for Blazor server project.

@page "/counter"
@rendermode InteractiveAuto
@inject IDataSourceFactory dataSourceFactory
 
<PageTitle>Counter</PageTitle>
 
<h1>Counter</h1>
 
<p role="status">Current count: @currentCount</p>
 
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
 
@code {
    private int currentCount = 0;
 
    private void IncrementCount()
    {
        dataSourceFactory.Create<SharedData.DataSourceResultType1>(25, "AAAAAA");
        currentCount++;
    }
}

using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using ServerTest.Client;
using SharedData;
 
var builder = WebAssemblyHostBuilder.CreateDefault(args);
 
builder.Services.AddSingleton<IDataSourceFactory, DataSourceFactory>();
await builder.Build().RunAsync();

Without injection in Razor page, WASM Build breakpoint is being hit. Once I add @inject, the page will crash even before WASM is built. And the worst of all, Blazor server DI service is being provided if defined on Blazor server. What?

Accepted answer

1 additional answer

Your answer

AgaveJoe 29,946 Reputation points

2024-02-24T00:04:15.5033333+00:00

The first step in debugging is reproducing the issue. It is very difficult to reproduce this issue without example code, steps to reproduce the problem, and your expected results.
Matěj Rada 40 Reputation points

2024-02-24T04:24:37.5033333+00:00

All I want to register interface IDataServiceFactory for two different Singleton. One for server side and one for WASM. Currently, any service registration in WASM is ignored and only server side services are being used in my WASM, when I am injecting by @inject in my Razor code. I've tried to bridge this by registering Singleton class directly in my WASM, but Razor would say that no service for this Singleton is registered ... Really whole scenario - i want implement custom Singleton service different for each environment, nothing more.
Rada Matěj 200 Reputation points

2024-02-24T05:51:06.09+00:00

This:

using ANeT_Client; using Microsoft.AspNetCore.Components.WebAssembly.Hosting; using SharedData; var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.Services.AddSingleton<IDataSourceFactory, DataSourceFactory>(); builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri("http://localhost:5244/") }); await builder.Build().RunAsync();

@page "/counter" @rendermode InteractiveAuto @inject IDataSourceFactory dataSource <PageTitle>Client Counter</PageTitle> <h1>Client Counter</h1>

Is jumping into this:

using ANeT_Client.Pages; using ANeT_Server; using ANeT_Server.Components; using Microsoft.Extensions.FileProviders; using SharedData; var builder = WebApplication.CreateBuilder(args); builder.Services.AddSingleton<IDataSourceFactory, DataSourceFactory>();

So @inject is calling my server Singleton:

using SharedData; using System.Reflection; namespace ANeT_Server { public class DataSourceFactory : IDataSourceFactory { public D Create<D>(int par1, string par2) where D : IFactoryableFromParameterType1

And direct Singleton for DataSourceFactor isn saying, that not service is registered ...

using ANeT_Client; using Microsoft.AspNetCore.Components.WebAssembly.Hosting; using SharedData; var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.Services.AddSingleton<DataSourceFactory>(); await builder.Build().RunAsync();

@page "/counter" @rendermode InteractiveAuto @inject DataSourceFactory dataSource <PageTitle>Client Counter</PageTitle> <h1>Client Counter</h1>

This should be working, but because I am debugging WASM by running Blazor server with reference to it, it is obviously using Blazor server service of my singleton ...
AgaveJoe 29,946 Reputation points

2024-02-24T11:56:40.7833333+00:00

I have .NET 8 Blazor test applications that execute server side DbContext and populate the UI as well as and client side HTTP request that call server side REST end points.

Yes, that's correct. In a Blazor WebAssembly (WASM) application, you can use Entity Framework Core (EF Core) to define a DbContext and DbSet for your entities. When you perform LINQ queries against these DbSet instances in your Blazor WASM application, EF Core will translate these queries into HTTP requests to a backend server hosting the EF Core database context.

I'm not sure where you are getting this information but it is not true.
You could simply create a interface inherited by two different implementations. One implementation executes LINQ (server side) while the other makes HTTP requests (client side). In my opinion, this is not a good approach because you are forcing the data interface from a data access layer to be the same as a REST service and the UI which is never the use case.

Lastly, read the following to make sure you understand service lifetime in Blazor.

ASP.NET Core Blazor with Entity Framework Core (EF Core)
Matěj Rada 40 Reputation points

2024-02-24T12:08:59.9066667+00:00

Yes, I need to implement Remote.Linq Nuget package. I have created an interface inherited by two different applications as for my snippet I have already shown here. But the problem is still the same. When debugging Blazor server, only server registered Singleton is @inject into my WASM Razor page. Added service in my WASM is ignored and I cannot properly develop my application WASM during debugging ...
Rada Matěj 200 Reputation points

2024-02-24T18:09:41.7733333+00:00

So, the problem is, that error occurred even before WASM builder creation:

This is really just the template used from VisualStudio for Blazor server project.

@page "/counter" @rendermode InteractiveAuto @inject IDataSourceFactory dataSourceFactory <PageTitle>Counter</PageTitle> <h1>Counter</h1> <p role="status">Current count: @currentCount</p> <button class="btn btn-primary" @onclick="IncrementCount">Click me</button> @code { private int currentCount = 0; private void IncrementCount() { dataSourceFactory.Create<SharedData.DataSourceResultType1>(25, "AAAAAA"); currentCount++; } }

using Microsoft.AspNetCore.Components.WebAssembly.Hosting; using ServerTest.Client; using SharedData; var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.Services.AddSingleton<IDataSourceFactory, DataSourceFactory>(); await builder.Build().RunAsync();

Without injection in Razor page, WASM Build breakpoint is being hit. Once I add @inject, the page will crash even before WASM is built. And the worst of all, Blazor server DI service is being provided if defined on Blazor server. What?

Answer 1

Rada Matěj 200

So, the problem is server-side rendering, which is also server-side resolving injections. After hours of researching, this is how to ensure only local WASM's injection will be used:

@inject IServiceProvider ServiceProvider

var factory = ServiceProvider.GetRequiredService<IDataSourceFactory>();

So, I will never use @inject ever, because this is really stupid idea to not provide clear vision where will be injection resolved. Aaaaaaaa.

Answer 2

Bruce (SqlWork.com) 73,081

Your use case is not clear. Why would you use a DBSet in Blazor WASM? It does not have access to a dbcontext (though there are samples of using SqlLite). You should be using the your EF POCO entries in the WASM.

Blazor WASM does not have network access, it needs to call javascript to access the network. Blazor's WASM WebClient() does this. If you want to use Remote Linq, you may need to write your own wrapper as wcf is not supported in Blazor WASM and is used by their default sample code. You will want a pure HttpClient() based api.

Matěj Rada 40 Reputation points

2024-02-24T04:16:36.0466667+00:00

First of all:

Yes, that's correct. In a Blazor WebAssembly (WASM) application, you can use Entity Framework Core (EF Core) to define a DbContext and DbSet for your entities. When you perform LINQ queries against these DbSet instances in your Blazor WASM application, EF Core will translate these queries into HTTP requests to a backend server hosting the EF Core database context.

And even if that is not true, I would create this Linq to QueryString translation myself. So still, I can use a very the same Linq between Blazor WASM and Blazor code, it just needs more abstraction by Injection and interfaces. (This is a very normal scenario - it was always the case that the same Linq can be transferred by HTTP request and used to obtain data from Server EF and return its result.) What I am actually complaining about is that creating interface IDataServiceFactory a implementing it on Blazor Server causing Blazor WASM DI issues. Once I register Blazor Server Singleton service for my interface, WASM's injection is jumping to that server code. Which seems to me, that is easily because I am debugging it at once - from one debugging environment. And Singleton registration in Program.cs of WASM seems to be ignored. I've tried to register and inject only client class on the client Razor, but such a service is not found. As I said, I have a functioning example from VisualStudio, I just created my interface and now I am trying to inject the same interface with different Singleton class, which can actually translate Linq itself by that regard. @inject on WASM's Razor is not injecting class defined by AddSingleton on WASM's Program.cs and instead it is using Server's service. How to solve it please?
Matěj Rada 40 Reputation points

2024-02-24T04:28:14.23+00:00

My comment seems to not post properly. Linq from WASM can be translated as HTTP query and executed like normal Linq to Entity on the server side. This should be supported natively by WASM. All I need is an aid with implementing different services for one interface. Currently, any service registration in WASM is ignored and only server side services are being used in my WASM, when I am injecting by @inject in my Razor code. I've tried to bridge this by registering Singleton class directly in my WASM, but Razor would say that no service for this Singleton is registered ... Really whole scenario - I want implement custom Singleton service different for each environment, nothing more.

Share via

When debugging Blazor Server, Blazor WASM's invoke is jumping to Server side

1 additional answer

Your answer