在 ASP.NET Core 之外呈现 Razor 组件

Razor 组件可以在 HTTP 请求的上下文之外呈现。 可以独立于 ASP.NET Core 托管环境，将 Razor 组件作为 HTML 直接呈现为字符串或数据流。 这对于你想生成 HTML 片段的场景是很方便的，例如生成电子邮件内容、生成静态网站内容或生成内容模板化引擎。

在以下示例中，Razor 组件从控制台应用呈现为 HTML 字符串：

在命令 shell 中，创建一个新的控制台应用项目：

dotnet new console -o ConsoleApp1
cd ConsoleApp1

在 ConsoleApp1 文件夹的命令 shell 中，将 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);

注意

在不传递参数的情况下呈现组件时将 ParameterView.Empty 传递给 RenderComponentAsync。

或者，可以通过调用 output.WriteHtmlTo(textWriter)，将 HTML 写入 TextWriter。

RenderComponentAsync 返回的任务在组件完全呈现时完成，包括完成任何异步生命周期方法。 如果要观察之前呈现的 HTML，请改为调用 BeginRenderingComponent。 然后，通过等待返回的 HtmlRootComponent 实例上的 HtmlRootComponent.QuiescenceTask 来等待组件呈现完成。