ASP.NET Core の外部で Razor コンポーネントをレンダリングする
Razor コンポーネントは、HTTP 要求のコンテキストの外部でレンダリングできます。 Razor コンポーネントは HTML として直接文字列にレンダリングしたり、または ASP.NET Core ホスティング環境とは無関係にストリームしたりできます。 これは、HTML フラグメントを生成したいシナリオに便利です。たとえば、メール コンテンツの生成、静的サイト コンテンツの生成、コンテンツのテンプレート エンジンの構築などです。
次の例では、Razor コンポーネントがコンソール アプリから HTML 文字列にレンダリングされます。
コマンド シェルで、新しいコンソール アプリ プロジェクトを作成します。
dotnet new console -o ConsoleApp1
cd ConsoleApp1
ConsoleApp1 フォルダー内のコマンド シェルで、Microsoft.AspNetCore.Components.Web と Microsoft.Extensions.Logging のパッケージ参照をコンソール アプリに追加します。
dotnet add package Microsoft.AspNetCore.Components.Web
dotnet add package Microsoft.Extensions.Logging
コンソール アプリのプロジェクト ファイル (ConsoleApp1.csproj) で、Razor SDK を使うようにコンソール アプリ プロジェクトを更新します。
- <Project Sdk="Microsoft.NET.Sdk">
+ <Project Sdk="Microsoft.NET.Sdk.Razor">
次の RenderMessage コンポーネントをプロジェクトに追加します。
RenderMessage.razor:
<h1>Render Message</h1>
<p>@Message</p>
@code {
[Parameter]
public string Message { get; set; }
}
Program ファイルを更新します。
- 依存関係の挿入 (IServiceCollection/BuildServiceProvider) とログ (AddLogging/ILoggerFactory) を設定します。
- HtmlRenderer を作成し、RenderComponentAsync を呼び出して
RenderMessageコンポーネントをレンダリングします。
RenderComponentAsync への呼び出しは、必ずコンポーネント ディスパッチャーで InvokeAsync を呼び出すコンテキストで行う必要があります。 コンポーネント ディスパッチャーは、HtmlRenderer.Dispatcher プロパティから使用できます。
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging;
using ConsoleApp1;
IServiceCollection services = new ServiceCollection();
services.AddLogging();
IServiceProvider serviceProvider = services.BuildServiceProvider();
ILoggerFactory loggerFactory = serviceProvider.GetRequiredService<ILoggerFactory>();
await using var htmlRenderer = new HtmlRenderer(serviceProvider, loggerFactory);
var html = await htmlRenderer.Dispatcher.InvokeAsync(async () =>
{
var dictionary = new Dictionary<string, object?>
{
{ "Message", "Hello from the Render Message component!" }
};
var parameters = ParameterView.FromDictionary(dictionary);
var output = await htmlRenderer.RenderComponentAsync<RenderMessage>(parameters);
return output.ToHtmlString();
});
Console.WriteLine(html);
Note
パラメーターを渡さずにコンポーネントをレンダリングする場合は、ParameterView.Empty を RenderComponentAsync に渡します。
または、output.WriteHtmlTo(textWriter) を呼び出して TextWriter に HTML を書き込むこともできます。
RenderComponentAsync によって返されるタスクは、非同期ライフサイクル メソッドの完了を含め、コンポーネントが完全にレンダリングされると完了します。 レンダリングされた HTML をさらに早く確認したい場合は、代わりに BeginRenderingComponent を呼び出します。 その後、返された HtmlRootComponent インスタンスで HtmlRootComponent.QuiescenceTask を待機して、コンポーネントのレンダリングが完了するまで待ちます。
ASP.NET Core