Compartir a través de


Representación de componentes de Razor fuera de ASP.NET Core

Los componentes de Razor se pueden representar fuera del contexto de una solicitud HTTP. Puede representar componentes de Razor como HTML directamente en una cadena o secuencia independientemente del entorno de hospedaje de ASP.NET Core. Esto es conveniente para escenarios en los que se quieren generar fragmentos HTML, como para generar contenido de correo electrónico, generar contenido de sitio estático o crear un motor de plantillas de contenido.

En el ejemplo siguiente, se representa un componente de Razor en una cadena HTML desde una aplicación de consola:

En un shell de comandos, cree un proyecto de aplicación de consola:

dotnet new console -o ConsoleApp1
cd ConsoleApp1

En un shell de comandos de la carpeta ConsoleApp1, agregue referencias de paquete para Microsoft.AspNetCore.Components.Web y Microsoft.Extensions.Logging a la aplicación de consola:

dotnet add package Microsoft.AspNetCore.Components.Web
dotnet add package Microsoft.Extensions.Logging

En el archivo de proyecto de la aplicación de consola (ConsoleApp1.csproj), actualice el proyecto de aplicación de consola para usar el SDK de Razor:

- <Project Sdk="Microsoft.NET.Sdk">
+ <Project Sdk="Microsoft.NET.Sdk.Razor">

Agregue el componente RenderMessage siguiente al proyecto.

RenderMessage.razor:

<h1>Render Message</h1>

<p>@Message</p>

@code {
    [Parameter]
    public string Message { get; set; }
}

Actualice el archivo Program:

Todas las llamadas a RenderComponentAsync se deben realizar en el contexto de llamar a InvokeAsync en un distribuidor de componentes. Un distribuidor de componentes está disponible en la propiedad 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);

Nota:

Pase ParameterView.Empty a RenderComponentAsync al representar el componente sin pasar parámetros.

Como alternativa, puede escribir el código HTML en TextWriter mediante una llamada a output.WriteHtmlTo(textWriter).

La tarea devuelta por RenderComponentAsync se completa cuando el componente se representa por completo, incluida la finalización de cualquier método de ciclo de vida asincrónico. Si desea observar el código HTML representado anteriormente, llame a BeginRenderingComponent en su lugar. A continuación, espere a que se complete la representación del componente esperando HtmlRootComponent.QuiescenceTask en la instancia de HtmlRootComponent devuelta.