HttpClient showing not registered Blazor WebAssembly

Question

HttpClient showing not registered Blazor WebAssembly

Prathamesh Shende 441

How to consume WebApi in blazor webassembly in .net 8 or 9.

I added scope Http Client but am still getting the error not registered Http Client.

My project is the render InteractiveWebAssembly Project, which has two project Client and Main.
main project has a component folder, and the client project has a pages folder.

I really don't understand the project structure of either.
If possible to you please share me the link where I learn project structure.

For HttpClient in BlazorWebassembly I do as this link -
https://learn.microsoft.com/en-us/aspnet/core/blazor/call-web-api?view=aspnetcore-9.0
but still getting error.

AgaveJoe 30,041 Reputation points

2025-04-23T17:42:34.0933333+00:00

You did not provide the error or sample code.

Try following the sample code for CSR.

https://learn.microsoft.com/en-us/aspnet/core/blazor/call-web-api?view=aspnetcore-9.0#sample-apps

https://github.com/dotnet/blazor-samples/

If you are still having trouble then please provide the error message and sample code.

Prathamesh Shende 441

InvalidOperationException: Cannot provide a value for property 'http' on type 'BlazorApp2.Client.Pages.Home'. There is no registered service of type 'System.Net.Http.HttpClient'.

program.cs - BlazorApp2.Client

using BlazorApp2.Client.Services;

using Microsoft.AspNetCore.Components.WebAssembly.Hosting;

using Microsoft.Extensions.DependencyInjection;

var builder = WebAssemblyHostBuilder.CreateDefault(args);

builder.Services.AddScoped(sp =>

new HttpClient

{

    BaseAddress = new Uri( "https://localhost:7056")

});
```builder.Services.AddScoped<IWeatherForecastService, WeatherForecastService>();

await builder.Build().RunAsync();

  
  
using System.Net.Http.Json;

namespace BlazorApp2.Client.Services

{

public class WeatherForecastService(HttpClient httpClient) : IWeatherForecastService

{

public async Task<List<WeatherForecast>?> Get()

{

    return await httpClient.GetFromJsonAsync<List<WeatherForecast>>("api/weatherforecast");

}

}


  
  
index.razor   
  
@page "/"

@using BlazorApp2.Client.Services

@inject IWeatherForecastService _weatherForecast

<PageTitle>Home</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

@if (weatherForecasts == null)

{

```sql
<p><em>Loading...</em></p>
```}

else

{

<thead>

    <tr>

        <th>Date</th>

        <th>Temp. (C)</th>

        <th>Temp. (F)</th>

        <th>Summary</th>

    </tr>

</thead>

<tbody>

    @foreach (var forecast in weatherForecasts)

    {

        <tr>

            <td>@forecast.Date.ToShortDateString()</td>

            <td>@forecast.TemperatureC</td>

            <td>@forecast.TemperatureF</td>

            <td>@forecast.Summary</td>

        </tr>

    }

</tbody>

</table>


@code

{

List<WeatherForecast> weatherForecasts = new();

protected override async Task OnInitializedAsync()

{

weatherForecasts = await _weatherForecast.Get();

}

Prathamesh Shende 441

Controller at BlazorApp2
[ApiController]

[Route("api/[controller]")]

public class WeatherForecastController : ControllerBase

{

private static readonly string[] Summaries = new[]

{

    "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"

};

private readonly ILogger<WeatherForecastController> _logger;

public WeatherForecastController(ILogger<WeatherForecastController> logger)

{

    _logger = logger;

}

[HttpGet(Name = "GetWeatherForecast")]

public IEnumerable<WeatherForecast> Get()

{

    return Enumerable.Range(1, 5).Select(index => new WeatherForecast

    {

        Date = DateOnly.FromDateTime(DateTime.Now.AddDays(index)),

        TemperatureC = Random.Shared.Next(-20, 55),

        Summary = Summaries[Random.Shared.Next(Summaries.Length)],

    })

    .ToArray();

}

}

this project is created at once when I select render mode Interactive WebAssembly.

Accepted answer

0 additional answers

Your answer

AgaveJoe 30,041 Reputation points

2025-04-23T17:42:34.0933333+00:00

You did not provide the error or sample code.

Try following the sample code for CSR.

https://learn.microsoft.com/en-us/aspnet/core/blazor/call-web-api?view=aspnetcore-9.0#sample-apps

https://github.com/dotnet/blazor-samples/

If you are still having trouble then please provide the error message and sample code.
Prathamesh Shende 441 Reputation points

2025-04-24T03:53:47.54+00:00

InvalidOperationException: Cannot provide a value for property 'http' on type 'BlazorApp2.Client.Pages.Home'. There is no registered service of type 'System.Net.Http.HttpClient'.

program.cs - BlazorApp2.Client

using BlazorApp2.Client.Services;

using Microsoft.AspNetCore.Components.WebAssembly.Hosting;

using Microsoft.Extensions.DependencyInjection;

var builder = WebAssemblyHostBuilder.CreateDefault(args);

builder.Services.AddScoped(sp =>

new HttpClient { BaseAddress = new Uri( "https://localhost:7056") }); ```builder.Services.AddScoped<IWeatherForecastService, WeatherForecastService>(); await builder.Build().RunAsync(); using System.Net.Http.Json; namespace BlazorApp2.Client.Services {

public class WeatherForecastService(HttpClient httpClient) : IWeatherForecastService

{

public async Task<List<WeatherForecast>?> Get() { return await httpClient.GetFromJsonAsync<List<WeatherForecast>>("api/weatherforecast"); }

}

index.razor @page "/" @using BlazorApp2.Client.Services @inject IWeatherForecastService _weatherForecast <PageTitle>Home</PageTitle> <h1>Hello, world!</h1> Welcome to your new app. @if (weatherForecasts == null) { ```sql <p><em>Loading...</em></p> ```} else {

<table class="table">

<thead> <tr> <th>Date</th> <th>Temp. (C)</th> <th>Temp. (F)</th> <th>Summary</th> </tr> </thead> <tbody> @foreach (var forecast in weatherForecasts) { <tr> <td>@forecast.Date.ToShortDateString()</td> <td>@forecast.TemperatureC</td> <td>@forecast.TemperatureF</td> <td>@forecast.Summary</td> </tr> } </tbody>

</table>

@code {

List<WeatherForecast> weatherForecasts = new();

protected override async Task OnInitializedAsync()

{

weatherForecasts = await _weatherForecast.Get();

}
Prathamesh Shende 441 Reputation points

2025-04-24T03:58:39.74+00:00

Controller at BlazorApp2
[ApiController]

[Route("api/[controller]")]

public class WeatherForecastController : ControllerBase

{

private static readonly string[] Summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" }; private readonly ILogger<WeatherForecastController> _logger; public WeatherForecastController(ILogger<WeatherForecastController> logger) { _logger = logger; } [HttpGet(Name = "GetWeatherForecast")] public IEnumerable<WeatherForecast> Get() { return Enumerable.Range(1, 5).Select(index => new WeatherForecast { Date = DateOnly.FromDateTime(DateTime.Now.AddDays(index)), TemperatureC = Random.Shared.Next(-20, 55), Summary = Summaries[Random.Shared.Next(Summaries.Length)], }) .ToArray(); }

}

this project is created at once when I select render mode Interactive WebAssembly.

Answer 1

Hi Prathamesh Shende,

Thank you for reaching out to Microsoft Q & A forum.

The error message InvalidOperationException: Cannot provide a value for property 'http'...suggests that the HttpClient service has not been correctly registered in the application's service container. When working with Blazor applications that use the Interactive WebAssembly render mode in .NET 8 or 9, it is essential to register services such as HttpClient in the Main project (in your case, BlazorApp2), rather than only in the Client project. This ensures that the service is available both during server-side prerendering and when the WebAssembly app runs on the client.

To resolve the issue, update the Program.cs file in the Main project as follows:

builder.Services.AddHttpClient("BlazorApp2.ServerAPI", client =>
{
    client.BaseAddress = new Uri("https://localhost:7056");
});
builder.Services.AddScoped(sp =>
    sp.GetRequiredService<IHttpClientFactory>().CreateClient("BlazorApp2.ServerAPI"));
builder.Services.AddScoped<IWeatherForecastService, WeatherForecastService>();

Make sure that your components inject IWeatherForecastService rather than HttpClient directly, unless HttpClient has been explicitly registered as shown above.

For additional guidance, please refer to the links that AgaveJoe shared earlier, which cover Blazor render modes, project structure, and sample implementations.

If you have found the answer provided to be helpful, please click on the "Accept answer/Upvote" button so that it is useful for other members in the Microsoft Q&A community.

Share via

HttpClient showing not registered Blazor WebAssembly

0 additional answers

Your answer