ASP.NET Core Blazor 구성

이 문서에서는 앱 설정, 인증 및 로깅 구성을 포함하여 앱을 구성하는 Blazor 방법을 설명합니다.

이 지침은 독립 실행형 Blazor WebAssembly 앱의 클라이언트 쪽 프로젝트 구성에 Blazor Web App 적용됩니다.

s의 Blazor Web App기본 동작:

• 서버 쪽 구성의 경우:
  • 지침은 ASP.NET Core의 구성을 참조하세요.
  • 프로젝트의 루트 앱 설정 파일의 구성만 로드됩니다.
  • 이 문서의 나머지 부분에서는 프로젝트의 클라이언트 쪽 구성에 .Client 만 적용됩니다.
• 클라이언트 쪽 구성(.Client 프로젝트)의 경우 다음 앱 설정 파일에서 구성이 로드됩니다.
  • wwwroot/appsettings.json.
  • wwwroot/appsettings.{ENVIRONMENT}.json. 여기서 {ENVIRONMENT} 자리 표시자는 앱의 런타임 환경입니다.

독립 실행형 Blazor WebAssembly 앱에서 구성은 다음 앱 설정 파일에서 로드됩니다.

• wwwroot/appsettings.json.
• wwwroot/appsettings.{ENVIRONMENT}.json. 여기서 {ENVIRONMENT} 자리 표시자는 앱의 런타임 환경입니다.

참고 항목

앱 설정 파일에 wwwroot 배치된 로깅 구성은 기본적으로 로드되지 않습니다. 자세한 내용은 이 문서의 뒷부분에 있는 로깅 구성 섹션을 참조하세요.

Azure 서비스와 같은 일부 시나리오에서는 환경 이름과 정확히 일치하는 환경 파일 이름 세그먼트를 사용해야 합니다. 예를 들어 환경에 대 Staging 문자 "S"가 있는 파일 이름을 appsettings.Staging.json 사용합니다. 권장 규칙은 ASP.NET Core 환경의 오프닝 발언을 참조하세요.Blazor

앱에서 등록한 다른 구성 공급자도 구성을 제공할 수 있지만, 모든 공급자 또는 공급자 기능이 적합한 것은 아닙니다.

• Azure Key Vault 구성 공급자: 공급자는 클라이언트 비밀 시나리오에서 관리 identity 및 애플리케이션 ID(클라이언트 ID)에 대해 지원되지 않습니다. 클라이언트 암호가 있는 애플리케이션 ID는 ASP.NET Core 앱, 특히 클라이언트 쪽 앱에는 권장되지 않습니다. 클라이언트 비밀은 클라이언트 쪽에서 Azure Key Vault 서비스에 액세스하도록 보호될 수 없기 때문입니다.
• Azure 앱 구성 공급자: 앱이 Azure의 서버에서 실행되지 않으므로 공급자가 클라이언트 쪽 앱에 적합하지 않습니다.

구성 공급자에 대한 자세한 내용은 ASP.NET Core의 구성을 참조하세요.

Warning

웹 루트(wwwroot 폴더)의 구성 및 설정 파일은 클라이언트의 사용자에게 표시되며 사용자는 데이터를 변조할 수 있습니다. 앱 비밀, 자격 증명 또는 기타 중요한 데이터를 웹 루트 파일에 저장하지 마세요.

앱 설정 구성

앱 설정 파일의 구성이 기본적으로 로드됩니다. 다음 예제에서는 UI 구성 값이 앱 설정 파일에 저장되어 있고 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>

클라이언트 보안 제한은 앱 구성에 대한 설정 파일을 포함하여 사용자 코드를 통해 파일에 직접 액세스할 수 없도록 합니다. wwwroot 폴더에서 구성으로 appsettings.json/appsettings.{ENVIRONMENT}.json 이외의 구성 파일을 읽으려면 HttpClient를 사용합니다.

Warning

웹 루트(wwwroot 폴더)의 구성 및 설정 파일은 클라이언트의 사용자에게 표시되며 사용자는 데이터를 변조할 수 있습니다. 앱 비밀, 자격 증명 또는 기타 중요한 데이터를 웹 루트 파일에 저장하지 마세요.

다음 예제에서는 구성 파일(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);

앞의 예제에서는 앱의 기본 주소를 가져오고 일반적으로 호스트 페이지의 태그 href 값에서 <base> 파생되는 (IWebAssemblyHostEnvironment.BaseAddress)로 기본 주소를 builder.HostEnvironment.BaseAddress 설정합니다.

메모리 구성 소스

다음 예제에서는 파일의 a 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>

IConfiguration.GetSection을 사용하여 C# 코드에서 구성 섹션을 가져옵니다. 다음 예제에서는 앞의 예제에서 구성의 wheels 섹션을 가져옵니다.

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

        ...
    }
}

인증 구성

앱 설정 파일에서 공용 인증 구성을 제공합니다.

wwwroot/appsettings.json:

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

파일에 있는 공급자 ConfigurationBinder.Bind 에 Identity 대한 구성을 로드합니다Program. 다음 예제에서는 OIDC 공급자에 대한 구성을 로드합니다.

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

Warning

웹 루트(wwwroot 폴더)의 구성 및 설정 파일은 클라이언트의 사용자에게 표시되며 사용자는 데이터를 변조할 수 있습니다. 앱 비밀, 자격 증명 또는 기타 중요한 데이터를 웹 루트 파일에 저장하지 마세요.

로깅 구성

이 섹션은 폴더의 앱 설정 파일을 통해 로깅을 구성하는 앱에 wwwroot 적용됩니다.

앱에 Microsoft.Extensions.Logging.Configuration 패키지를 추가합니다.

참고 항목

.NET 앱에 패키지를 추가하는 방법에 대한 지침은 패키지 사용 워크플로에서 패키지 설치 및 관리의 문서(NuGet 설명서)를 참조하세요. NuGet.org에서 올바른 패키지 버전을 확인합니다.

앱 설정 파일에서 로깅 구성을 제공합니다. 로깅 구성이 파일에 로드됩니다 Program .

wwwroot/appsettings.json:

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

Program 파일에서:

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

호스트 빌더 구성

파일에서 WebAssemblyHostBuilder.Configuration 호스트 작성기 구성을 읽습니다 Program .

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

캐시된 구성

구성 파일은 오프라인으로 사용할 수 있도록 캐시됩니다. PWA(프로그레시브 웹 애플리케이션)의 경우 새 배포를 만들 때만 구성 파일을 업데이트할 수 있습니다. 여러 배포 간에 구성 파일을 편집하는 것은 다음과 같은 이유로 인해 적용되지 않습니다.

• 사용자에게 계속해서 사용할 수 있는 캐시된 버전의 파일이 있습니다.
• 사용자가 다음번에 온라인으로 방문할 때 앱이 다시 배포되었음을 앱에 알려 주는 PWA의 service-worker.js 및 service-worker-assets.js 파일은 컴파일 시 다시 빌드되어야 합니다.

PWA에서 백그라운드 업데이트를 처리하는 방법에 대한 자세한 내용은 ASP.NET Core Blazor PWA(프로그레시브 웹 애플리케이션)를 참조하세요.

옵션 구성

옵션 구성 을 사용하려면 NuGet 패키지에 대한 패키지 참조를 Microsoft.Extensions.Options.ConfigurationExtensions 추가해야 합니다.

참고 항목

.NET 앱에 패키지를 추가하는 방법에 대한 지침은 패키지 사용 워크플로에서 패키지 설치 및 관리의 문서(NuGet 설명서)를 참조하세요. NuGet.org에서 올바른 패키지 버전을 확인합니다.

예시:

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

Razor 구성 요소에서 모든 ASP.NET Core 옵션 기능이 지원되지는 않습니다. 예를 들어 IOptionsSnapshot<TOptions> 및 IOptionsMonitor<TOptions> 구성이 지원되지만, 새 브라우저 탭에서 앱을 요청하거나 브라우저의 다시 로드 단추를 선택하여 앱을 다시 로드하는 것 외에는 이러한 인터페이스에 대한 옵션 값을 다시 계산하는 것이 지원되지 않습니다. StateHasChanged를 호출해도 기본 구성이 변경될 때 스냅샷 또는 모니터링되는 옵션 값은 업데이트되지 않습니다.