.NET 8 Blazor WASM客户端组件依赖注入失效求助

核心原因 #

你的组件默认启用了服务器预渲染，预渲染阶段会从服务器DI容器尝试获取服务，但你仅在客户端注册了服务，因此触发"找不到注册服务"的错误。同时注册两端能运行，是因为服务器端也提供了服务实例，但业务服务依赖ILocalStorageService、HttpClient等客户端特有的服务，无法在服务器端注册，需要针对性处理。

解决方法1：禁用组件预渲染（简单直接） #

修改组件的渲染模式，明确关闭预渲染，让组件直接在客户端WebAssembly环境中激活，使用客户端DI容器：

@rendermode InteractiveWebAssembly(prerender: false)
@inject TestDi TestService

此方法适合不需要预渲染的场景，无需额外修改服务注册逻辑。

解决方法2：保留预渲染，适配服务获取逻辑 #

如果需要保留预渲染以提升首屏体验，可以通过"服务器端占位实现+客户端延迟调用"的方式处理：

1. 定义服务接口（规范服务契约）：

public interface ITestDi
{
    // 声明你的服务方法
    Task<string> GetDataAsync();
}

// 客户端真实实现（依赖ILocalStorageService、HttpClient）
public class TestDi : ITestDi
{
    private readonly ILocalStorageService _localStorage;
    private readonly HttpClient _httpClient;

    public TestDi(ILocalStorageService localStorage, HttpClient httpClient)
    {
        _localStorage = localStorage;
        _httpClient = httpClient;
    }

    public async Task<string> GetDataAsync()
    {
        // 业务逻辑实现
        var token = await _localStorage.GetItemAsync<string>("auth_token");
        return await _httpClient.GetStringAsync($"api/data?token={token}");
    }
}

2. 服务器端注册占位实现（仅用于预渲染阶段，避免报错）：

// 服务器端Program.cs
builder.Services.AddScoped<ITestDi, TestDiServerPlaceholder>();

// 占位类，无需业务逻辑
public class TestDiServerPlaceholder : ITestDi
{
    public Task<string> GetDataAsync()
    {
        // 预渲染阶段不会执行客户端逻辑，返回默认值即可
        return Task.FromResult(string.Empty);
    }
}

3. 客户端注册真实实现：

// 客户端Program.cs
builder.Services.AddScoped<ITestDi, TestDi>();
builder.Services.AddBlazoredLocalStorage(); // 注册客户端依赖

4. 组件中延迟调用服务：
   仅在客户端激活后（而非预渲染阶段）执行服务逻辑：

@rendermode InteractiveWebAssembly
@inject ITestDi TestService
@using Microsoft.AspNetCore.Components.WebAssembly.Services

<p>@Data</p>

@code {
    private string Data { get; set; }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            // 确保在客户端环境中执行服务调用
            Data = await TestService.GetDataAsync();
            StateHasChanged();
        }
    }
}

解决方法3：检查客户端项目配置 #

确保服务器项目正确引用客户端WebAssembly项目，且客户端启动逻辑正常：

• 在服务器项目的.csproj中确认依赖引用：

<ProjectReference Include="..\YourClientProject\YourClientProject.csproj" />

• 客户端Program.cs确保服务注册和启动逻辑完整：

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

// 注册业务服务和客户端依赖
builder.Services.AddScoped<TestDi>();
builder.Services.AddBlazoredLocalStorage();
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });

await builder.Build().RunAsync();

内容的提问来源于stack exchange，提问作者king_ozymandias