Rendern von Razor-Komponenten außerhalb von ASP.NET Core

Razor-Komponenten können außerhalb des Kontexts einer HTTP-Anforderung gerendert werden. Sie können Razor-Komponenten als HTML direkt in eine Zeichenfolge oder einen Stream rendern – unabhängig von der ASP.NET Core-Hostingumgebung. Dies ist praktisch in Szenarien, in denen Sie HTML-Fragmente generieren möchten, beispielsweise zum Generieren von E-Mail-Inhalt oder statischen Website-Inhalten oder zum Entwickeln einer Engine für die Inhaltsvorlagenerstellung.

Im folgenden Beispiel wird aus einer Konsolenanwendung eine Razor-Komponente in eine HTML-Zeichenfolge gerendert:

Erstellen Sie in einer Befehlsshell ein neues Konsolen-App-Projekt:

dotnet new console -o ConsoleApp1
cd ConsoleApp1

Fügen Sie in einer Befehlsshell im Ordner ConsoleApp1 der Konsolen-App Paketverweise für Microsoft.AspNetCore.Components.Web und Microsoft.Extensions.Logging hinzu:

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

Aktualisieren Sie in der Projektdatei der Konsolen-App (ConsoleApp1.csproj) das Projekt der Konsolen-App, um das Razor SDK zu verwenden:

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

Fügen Sie dem Projekt die folgende RenderMessage-Komponente hinzu.

RenderMessage.razor:

<h1>Render Message</h1>

<p>@Message</p>

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

Aktualisieren Sie die Datei Program:

• Richten Sie die Abhängigkeitsinjektion (IServiceCollection/BuildServiceProvider) und die Protokollierung (AddLogging/ILoggerFactory) ein.
• Erstellen Sie einen HtmlRenderer, und rendern Sie die RenderMessage-Komponente, indem Sie RenderComponentAsync aufrufen.

Alle RenderComponentAsync-Aufrufe müssen im Kontext des InvokeAsync-Aufrufs für einen Komponentenverteiler erfolgen. Ein Komponentenverteiler ist über die HtmlRenderer.Dispatcher-Eigenschaft verfügbar.

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

Hinweis

Übergeben Sie beim Rendern der Komponente ParameterView.Empty an RenderComponentAsync, ohne Parameter zu übergeben.

Alternativ können Sie den HTML-Code in eine TextWriter-Klasse schreiben, indem Sie output.WriteHtmlTo(textWriter) aufrufen.

Die von RenderComponentAsync zurückgegebene Aufgabe wird abgeschlossen, wenn die Komponente vollständig gerendert wurde, einschließlich der Beendigung aller asynchronen Lebenszyklusmethoden. Wenn Sie den gerenderten HTML-Code schon früher einsehen möchten, rufen Sie stattdessen BeginRenderingComponent auf. Warten Sie dann, bis das Rendering der Komponente abgeschlossen wurde, indem Sie HtmlRootComponent.QuiescenceTask für die zurückgegebene HtmlRootComponent-Instanz abwarten.