Рендеринг Razor компонентов вне ASP.NET Core

Razor компоненты, которые являются автономными частями пользовательского интерфейса с логикой обработки, используемой в ASP.NET Core Blazor, можно отобразить вне контекста HTTP-запроса. Компоненты Razor можно отрисовывать напрямую как HTML в строку или поток независимо от хостинг-среды ASP.NET Core. Это удобно для сценариев, в которых требуется создать фрагменты HTML, например для создания содержимого электронной почты, создания статического содержимого сайта или для создания обработчика шаблонов контента.

В следующем примере компонент Razor преобразуется из консольного приложения в HTML-строку.

В командной оболочке создайте проект консольного приложения и измените каталог на папку ConsoleApp1:

dotnet new console -o ConsoleApp1
cd ConsoleApp1

Добавьте ссылку на пакет для Microsoft.AspNetCore.Components.Web:

dotnet add package Microsoft.AspNetCore.Components.Web

Добавьте ссылку на пакет для Microsoft.Extensions.Logging:

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 и отрисуйте компонент RenderMessage путем вызова RenderComponentAsync.

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);

Все вызовы RenderComponentAsync должны выполняться в контексте вызова InvokeAsync диспетчера компонентов. Диспетчер компонентов доступен из свойства HtmlRenderer.Dispatcher.

Кроме того, можно написать HTML-код в TextWriter, вызвав output.WriteHtmlTo(textWriter).

Задача, возвращаемая RenderComponentAsync, завершается после полной отрисовки компонента, включая выполнение любых асинхронных методов жизненного цикла. Если вы хотите просмотреть отрисованный HTML ранее, вызовите BeginRenderingComponent вместо этого. Затем дождитесь завершения отрисовки компонента, вызвав HtmlRootComponent.QuiescenceTask для возвращенного экземпляра HtmlRootComponent.