如何将服务注入 Blazor？

Question

我在尝试将某些服务注入客户端项目时遇到问题。在 Program.cs 文件中，我有以下内容：

public class Program
    {
        public static async Task Main(string[] args)
        {
            var builder = WebAssemblyHostBuilder.CreateDefault(args);
            builder.RootComponents.Add<App>("#app");

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

            await builder.Build().RunAsync();

            ConfigureServices(builder.Services);

        }


        public static void ConfigureServices(IServiceCollection services)
        {
            services.AddSingleton<IMetamaskInterop, MetamaskBlazorInterop>();
            services.AddSingleton<MetamaskService>();
            services.AddSingleton<MetamaskInterceptor>();
        }
    }

在一个新组件中，我尝试按如下方式注入这些服务：

@inject IJSRuntime JSRuntime;
@inject MetamaskService metamaskService;
@inject MetamaskInterceptor metamaskInterceptor;

但是这样做会给我一个错误，错误如下：

感谢任何帮助或指导。

Answer 1

您正在启动应用程序后配置服务。

在await builder.Build().RunAsync();前添加ConfigureServices(builder.Services);。

public class Program
{
    public static async Task Main(string[] args)
    {
        var builder = WebAssemblyHostBuilder.CreateDefault(args);
        builder.RootComponents.Add<App>("#app");

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

        // configure services before running the app
        ConfigureServices(builder.Services);

        await builder.Build().RunAsync();

    }


    public static void ConfigureServices(IServiceCollection services)
    {
        services.AddSingleton<IMetamaskInterop, MetamaskBlazorInterop>();
        services.AddSingleton<MetamaskService>();
        services.AddSingleton<MetamaskInterceptor>();
    }
}

Answer 2

您不应该在 Program class 中引入名为 ConfigureServices 的新静态方法。这不是引发异常的原因，但它具有很大的误导性，因为 ConfigureServices 是 Startup class 中定义的方法的名称（过去在 WebAssembly Blazor 中使用，然后删除.. .).

有时，您可能需要第二种方法进行条件配置，但不要命名它ConfigureServices。在当前实例中，您不需要第二种方法。照下面的方法做就好了。

当你使用第二种方法时，你不能运行 await builder.Build().RunAsync(); 当此代码构建并执行您的应用程序时，为时已晚，无法向服务集合中添加更多服务。只需将 IServiceCollection 对象传递给第二个方法，当它 returns 构建并运行您的应用程序时。

这是您的代码的更新版本：

public class Program
    {
        public static async Task Main(string[] args)
        {
            var builder = WebAssemblyHostBuilder.CreateDefault(args);
            builder.RootComponents.Add<App>("#app");

            builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
            
            builder.Services.AddSingleton<IMetamaskInterop, MetamaskBlazorInterop>();
            builder.Services.AddSingleton<MetamaskService>();
            builder.Services.AddSingleton<MetamaskInterceptor>();

            await builder.Build().RunAsync();
        }
    }

如何将服务注入 Blazor？

How to inject a service into Blazor?

blazor

blazor-client-side

asp.net-blazor