Конфигурация Blazor ASP.NET Core

В этой статье объясняется, как настроить Blazor приложения, включая параметры приложения, проверку подлинности и конфигурацию ведения журнала.

Другие поставщики конфигурации, зарегистрированные приложением, также могут предоставлять конфигурацию, но не все поставщики или функции поставщика подходят:

• Поставщик конфигурации Azure Key Vault: данный поставщик не поддерживает сценарии с управляемым удостоверением и идентификатором приложения (идентификатор клиента) с секретом клиента. Идентификатор приложения с секретом клиента не рекомендуется использовать для любого приложения ASP.NET Core, особенно для клиентских приложений, так как секрет клиента не может быть защищен на стороне клиента для доступа к службе Azure Key Vault.
• поставщик конфигурации для Azure App: не подходит для клиентских приложений, поскольку приложение не запускается на сервере в Azure.

Дополнительные сведения о поставщиках конфигурации см. в статье Конфигурация в ASP.NET Core.

Конфигурация параметров приложения

По умолчанию загружается конфигурация из файлов параметров приложения. В приведенном ниже примере значение конфигурации пользовательского интерфейса хранится в файле параметров приложения и автоматически загружается платформой Blazor. Значение считывается компонентом.

wwwroot/appsettings.json:

{
    "h1FontSize": "50px"
}

Внедрите экземпляр IConfiguration в компонент для доступа к данным конфигурации.

ConfigExample.razor:

@page "/config-example"
@inject IConfiguration Configuration

<PageTitle>Configuration</PageTitle>

<h1 style="font-size:@Configuration["h1FontSize"]">
    Configuration example (50px)
</h1>

@page "/config-example"
@inject IConfiguration Configuration

<PageTitle>Configuration</PageTitle>

<h1 style="font-size:@Configuration["h1FontSize"]">
    Configuration example (50px)
</h1>

@page "/config-example"
@inject IConfiguration Configuration

<h1 style="font-size:@Configuration["h1FontSize"]">
    Configuration example
</h1>

@page "/config-example"
@inject IConfiguration Configuration

<h1 style="font-size:@Configuration["h1FontSize"]">
    Configuration example
</h1>

@page "/config-example"
@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration

<h1 style="font-size:@Configuration["h1FontSize"]">
    Configuration example
</h1>

@page "/config-example"
@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration

<h1 style="font-size:@Configuration["h1FontSize"]">
    Configuration example
</h1>

Ограничения безопасности клиента предотвращают прямой доступ к файлам с помощью пользовательского кода, включая файлы параметров для конфигурации приложения. Чтобы считывать файлы конфигурации, помимо appsettings.json/appsettings.{ENVIRONMENT}.json, из папки wwwroot в конфигурацию, используйте HttpClient.

В приведенном ниже примере данные из файла конфигурации (cars.json) считываются в конфигурацию приложения.

wwwroot/cars.json:

{
    "size": "tiny"
}

Добавьте пространство имен для Microsoft.Extensions.Configuration к файлу Program:

using Microsoft.Extensions.Configuration;

Измените существующую HttpClient регистрацию службы, чтобы использовать клиент для чтения файла:

var http = new HttpClient()
{
    BaseAddress = new Uri(builder.HostEnvironment.BaseAddress)
};

builder.Services.AddScoped(sp => http);

using var response = await http.GetAsync("cars.json");
using var stream = await response.Content.ReadAsStreamAsync();

builder.Configuration.AddJsonStream(stream);

В предыдущем примере задается базовый адрес с помощью builder.HostEnvironment.BaseAddress (IWebAssemblyHostEnvironment.BaseAddress), который используется для установки базового адреса приложения и обычно выводится из значения тега <base> в теге href на хост-странице.

Источник конфигурации памяти

В следующем примере используется MemoryConfigurationSource в Program файле для предоставления дополнительной конфигурации.

Добавьте пространство имен Microsoft.Extensions.Configuration.Memory в файл Program:

using Microsoft.Extensions.Configuration.Memory;

В файле Program:

var vehicleData = new Dictionary<string, string?>()
{
    { "color", "blue" },
    { "type", "car" },
    { "wheels:count", "3" },
    { "wheels:brand", "Blazin" },
    { "wheels:brand:type", "rally" },
    { "wheels:year", "2008" },
};

var memoryConfig = new MemoryConfigurationSource { InitialData = vehicleData };

builder.Configuration.Add(memoryConfig);

Внедрите экземпляр IConfiguration в компонент для доступа к данным конфигурации.

MemoryConfig.razor:

@page "/memory-config"
@inject IConfiguration Configuration

<PageTitle>Memory Configuration</PageTitle>

<h1>Memory Configuration Example</h1>

<h2>General specifications</h2>

<ul>
    <li>Color: @Configuration["color"]</li>
    <li>Type: @Configuration["type"]</li>
</ul>

<h2>Wheels</h2>

<ul>
    <li>Count: @Configuration["wheels:count"]</li>
    <li>Brand: @Configuration["wheels:brand"]</li>
    <li>Type: @Configuration["wheels:brand:type"]</li>
    <li>Year: @Configuration["wheels:year"]</li>
</ul>

@page "/memory-config"
@inject IConfiguration Configuration

<PageTitle>Memory Configuration</PageTitle>

<h1>Memory Configuration Example</h1>

<h2>General specifications</h2>

<ul>
    <li>Color: @Configuration["color"]</li>
    <li>Type: @Configuration["type"]</li>
</ul>

<h2>Wheels</h2>

<ul>
    <li>Count: @Configuration["wheels:count"]</li>
    <li>Brand: @Configuration["wheels:brand"]</li>
    <li>Type: @Configuration["wheels:brand:type"]</li>
    <li>Year: @Configuration["wheels:year"]</li>
</ul>

@page "/memory-config"
@inject IConfiguration Configuration

<h1>Memory configuration example</h1>

<h2>General specifications</h2>

<ul>
    <li>Color: @Configuration["color"]</li>
    <li>Type: @Configuration["type"]</li>
</ul>

<h2>Wheels</h2>

<ul>
    <li>Count: @Configuration["wheels:count"]</li>
    <li>Brand: @Configuration["wheels:brand"]</li>
    <li>Type: @Configuration["wheels:brand:type"]</li>
    <li>Year: @Configuration["wheels:year"]</li>
</ul>

@page "/memory-config"
@inject IConfiguration Configuration

<h1>Memory configuration example</h1>

<h2>General specifications</h2>

<ul>
    <li>Color: @Configuration["color"]</li>
    <li>Type: @Configuration["type"]</li>
</ul>

<h2>Wheels</h2>

<ul>
    <li>Count: @Configuration["wheels:count"]</li>
    <li>Brand: @Configuration["wheels:brand"]</li>
    <li>Type: @Configuration["wheels:brand:type"]</li>
    <li>Year: @Configuration["wheels:year"]</li>
</ul>

@page "/memory-config"
@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration

<h1>Memory configuration example</h1>

<h2>General specifications</h2>

<ul>
    <li>Color: @Configuration["color"]</li>
    <li>Type: @Configuration["type"]</li>
</ul>

<h2>Wheels</h2>

<ul>
    <li>Count: @Configuration["wheels:count"]</li>
    <li>Brand: @Configuration["wheels:brand"]</li>
    <li>Type: @Configuration["wheels:brand:type"]</li>
    <li>Year: @Configuration["wheels:year"]</li>
</ul>

@page "/memory-config"
@using Microsoft.Extensions.Configuration
@inject IConfiguration Configuration

<h1>Memory configuration example</h1>

<h2>General specifications</h2>

<ul>
    <li>Color: @Configuration["color"]</li>
    <li>Type: @Configuration["type"]</li>
</ul>

<h2>Wheels</h2>

<ul>
    <li>Count: @Configuration["wheels:count"]</li>
    <li>Brand: @Configuration["wheels:brand"]</li>
    <li>Type: @Configuration["wheels:brand:type"]</li>
    <li>Year: @Configuration["wheels:year"]</li>
</ul>

Получите раздел конфигурации в коде C# с помощью IConfiguration.GetSection. В приведенном ниже примере извлекается раздел wheels конфигурации из предыдущего примера.

@code {
    protected override void OnInitialized()
    {
        var wheelsSection = Configuration.GetSection("wheels");

        ...
    }
}

Конфигурация проверки подлинности

Укажите конфигурацию общедоступной проверки подлинности в файле параметров приложения.

wwwroot/appsettings.json:

{
  "Local": {
    "Authority": "{AUTHORITY}",
    "ClientId": "{CLIENT ID}"
  }
}

Загрузите конфигурацию для поставщика Identity с ConfigurationBinder.Bind в файле Program. В следующем примере загружается конфигурация для поставщика OIDC:

builder.Services.AddOidcAuthentication(options =>
    builder.Configuration.Bind("Local", options.ProviderOptions));

Конфигурация ведения журнала

Этот раздел относится к приложениям, которые настраивают ведение журнала с помощью файла параметров приложения в папке wwwroot .

Добавьте пакет Microsoft.Extensions.Logging.Configuration в приложение.

В файле параметров приложения укажите конфигурацию ведения журнала. Конфигурация ведения журнала загружается в Program файл.

wwwroot/appsettings.json:

{
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft.AspNetCore": "Warning"
    }
  }
}

В файле Program:

builder.Logging.AddConfiguration(
    builder.Configuration.GetSection("Logging"));

Конфигурация Host Builder

Чтение конфигурации построителя хоста из WebAssemblyHostBuilder.Configuration в Program файла:

var hostname = builder.Configuration["HostName"];

Кэшированная конфигурация

Файлы конфигурации кэшируются для автономного использования. При использовании Progressive Web Applications (PWAs) файлы конфигурации можно изменять только при создании развертывания. Изменение файлов конфигурации между развертываниями не работает по следующим причинам:

• У пользователей есть кэшированные версии файлов, которые они продолжают использовать.
• Файлы service-worker.js и service-worker-assets.js PWA должны быть перестроены при компиляции, что при следующем входе пользователя в сеть сообщает приложению о том, что приложение было развернуто повторно.

Дополнительные сведения об обработке фоновых обновлений прогрессивными веб-приложениями см. в статье Прогрессивные веб-приложения Blazor ASP.NET Core.

Конфигурация параметров

Конфигурация параметров использует API в пакете Microsoft.Extensions.Options.ConfigurationExtensions NuGet.

Пример:

OptionsExample.cs:

public class OptionsExample
{
    public string? Option1 { get; set; }
    public string? Option2 { get; set; }
}

В appsettings.json:

"OptionsExample": {
  "Option1": "Option1 Value",
  "Option2": "Option2 Value"
}

builder.Services.Configure<OptionsExample>(
    builder.Configuration.GetSection("OptionsExample"));

Следующий компонент Razor извлекает параметры с директивой @inject или атрибутом [Inject].

Options.razor:

@page "/options"
@using Microsoft.Extensions.Options
@inject IOptions<OptionsExample>? OptionsExample1

<h1>Options</h1>

<h2>
    &commat;inject approach
</h2>

<ul>
    <li>@OptionsExample1?.Value.Option1</li>
    <li>@OptionsExample1?.Value.Option2</li>
</ul>

<h2>
    [Inject] approach
</h2>

<ul>
    <li>@OptionsExample2?.Value.Option1</li>
    <li>@OptionsExample2?.Value.Option2</li>
</ul>

@code {
    [Inject]
    public IOptions<OptionsExample>? OptionsExample2 { get; set; }
}

В компонентах Razor поддерживаются не все возможности параметров ASP.NET Core. Например, поддерживается конфигурация IOptionsSnapshot<TOptions> и IOptionsMonitor<TOptions>, но повторное вычисление значений параметров для этих интерфейсов возможно только за счет перезагрузки приложения путем его запроса в новой вкладке или нажатия кнопки перезагрузки в браузере. Изменение базовой конфигурации не обновляет снимок состояния или значения отслеживаемых параметров при простом вызове StateHasChanged.