Restituer des composants Razor en dehors de ASP.NET Core

Remarque

Ceci n’est pas la dernière version de cet article. Pour la version actuelle, consultez la version .NET 9 de cet article.

Important

Ces informations portent sur la préversion du produit, qui est susceptible d’être en grande partie modifié avant sa commercialisation. Microsoft n’offre aucune garantie, expresse ou implicite, concernant les informations fournies ici.

Pour la version actuelle, consultez la version .NET 9 de cet article.

Razor les composants peuvent être rendus en dehors du contexte d’une requête HTTP. Vous pouvez restituer des composants Razor au format HTML directement dans une chaîne ou un flux indépendamment de l’environnement d’hébergement ASP.NET Core. Cela est pratique pour les scénarios où vous souhaitez générer des fragments HTML, par exemple pour générer du contenu de courrier électronique, générer du contenu de site statique ou créer un moteur de création de modèles de contenu.

Dans l’exemple suivant, un Razor composant est rendu dans une chaîne HTML à partir d’une application console :

Dans un interpréteur de commandes, créez un projet d’application console :

dotnet new console -o ConsoleApp1
cd ConsoleApp1

Dans un interpréteur de commandes du dossierConsoleApp1, ajoutez des références de package pour Microsoft.AspNetCore.Components.Web et Microsoft.Extensions.Logging à l’application console :

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

Dans le fichier projet de l’application console (ConsoleApp1.csproj), mettez à jour le projet d’application console pour utiliser le Razor Kit de développement logiciel (SDK) :

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

Ajoutez le composant RenderMessage suivant au projet.

RenderMessage.razor:

<h1>Render Message</h1>

<p>@Message</p>

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

Mettez à jour le fichier Program :

• Configurez l’injection de dépendances (IServiceCollection/BuildServiceProvider) et la journalisation (AddLogging/ILoggerFactory).
• Créez un HtmlRenderer et affichez le composant RenderMessage en appelant RenderComponentAsync.

Tous les appels à RenderComponentAsync doivent être effectués dans le contexte de l’appel InvokeAsync sur un répartiteur de composants. Un répartiteur de composants est disponible à partir de la propriété 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);

Notes

Passez ParameterView.Empty à RenderComponentAsync lors du rendu du composant sans passer de paramètres.

Vous pouvez également écrire le code HTML dans un TextWriter en appelant output.WriteHtmlTo(textWriter).

La tâche retournée par RenderComponentAsync se termine lorsque le composant est entièrement rendu, y compris l’exécution des méthodes de cycle de vie asynchrones. Si vous souhaitez observer le code HTML rendu précédemment, appelez BeginRenderingComponent plutôt. Attendez ensuite que le rendu du composant se termine en attendant HtmlRootComponent.QuiescenceTask sur l’instance retournée HtmlRootComponent .