在 Blazor WebAssembly 中将不同的 appsettings.json 加载到 Window 对象中

Question

我目前正在开发 .NET Standard 2.1 Blazor WebAssembly 应用程序。我尝试将不同的 appsettings.{Environment}.json 配置加载到我的 Window 命名空间 (JavaScript).

所以我关注这个博客 post:

https://jkdev.me/blazor-appsettings/

到目前为止一切顺利：我在我的 wwwroot 目录中添加了 3 个 appsettings.*.json 文件：

appsettings.json:

{
  "App": {
    "Message": "Hello World!"
  }
}

appsettings.Development.json:

{
  "App": {
    "Environment": "Development"
  }
}

appsettings.Staging.json:

{
  "App": {
    "Environment": "Staging"
  }
}

在我的 program.cs Main 方法中，我像这样构建新的配置设置：

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

        ConfigureServices(builder.Services);

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

    private static void ConfigureServices(IServiceCollection services)
    {
        services.AddSingleton(
             provider =>
                 {
                     var config = provider.GetService<IConfiguration>();

                     return config.GetSection("App").Get<AppConfiguration>();
                 });

    }
}

public class AppConfiguration
{
    public string Environment { get; set; }
}

进一步，我尝试根据设置的环境变量（在脚本中）加载正确的 appsettings.json，因此我需要像这样覆盖 Blazor 启动过程：

<script src="_framework/blazor.webassembly.js" autostart="false"></script>
<script>
    const environmentName = 'Staging';
    Blazor.start({
        loadBootResource: function(type, name, defaultUri, integrity) {
            // Adds a custom HTTP header to the outbound requests
            // To retain the default integrity checking behavior, it's necessary to pass through the 'integrity' parameter
            return fetch(defaultUri,
                {
                    cache: 'no-cache',
                    integrity: integrity,
                    headers: { 'blazor-environment': environmentName }
                });
        }
    });
</script>

不幸的是，此编码不起作用 - 我总是收到错误消息：

您知道如何在 JavaScript 中正确覆盖 Blazor.start 启动过程吗？

遗憾的是，目前还没有太多文档。

您知道如何在 Blazor WASM 中加载不同的应用设置*。json 配置吗？

Answer 1

应用程序设置是每个环境。这意味着您需要通过设置 ASPNETCORE_ENVIRONMENT 环境变量或 blazor-environment 在服务器端设置环境变量回复 header : https://docs.microsoft.com/en-us/aspnet/core/blazor/fundamentals/environments?view=aspnetcore-3.1

Blazor Wasm 启动脚本将加载 appsettings.json 和 appsettings.{Environment}.json对应于 blazor-environment 的文件已收到并使用这些文件中的数据填充 WebAssemblyHostBuilder.Configuration。

然后您可以配置您的组件、服务或 js。
https://docs.microsoft.com/en-us/aspnet/core/blazor/fundamentals/configuration?view=aspnetcore-3.1

在 Blazor WebAssembly 中将不同的 appsettings.json 加载到 Window 对象中

Load different appsettings.json into Window object in Blazor WebAssembly

javascript

c#

webassembly

asp.net-core

blazor