Comment configurer le routage du serveur ASP.net Core pour plusieurs SPAs hébergés avec SpaServices

Question

J'ai une application Angular 5 que je veux héberger avec Angular Universal sur ASP.net Core en utilisant la dernière version de Modèle Angular RC . J'ai suivi la documentation et l'application est opérationnelle. Le problème, c'est que j'utilise également l'outil Angular Outils i18n qui produisent plusieurs applications compilées, une par locale. Je dois être en mesure d'héberger chacune d'entre elles à partir de https://myhost.com/{locale}/ .

Je sais que je peux créer une instance de l'application ASP.net Core pour chaque langue, et configurer l'hébergement dans le serveur Web pour que les chemins appropriés mènent à l'application associée, mais cela me semble excessif.

Les routes sont configurées avec :

// app is an instance of Microsoft.AspNetCore.Builder.IApplicationBuilder
app.UseMvc(routes =>
{
    routes.MapRoute(
        name: "default",
        template: "{controller}/{action=Index}/{id?}");
});

Les SpaServices sont configurés avec :

app.UseSpa(spa =>
{
    // To learn more about options for serving an Angular SPA from ASP.NET Core,
    // see https://go.microsoft.com/fwlink/?linkid=864501

    spa.Options.SourcePath = "ClientApp";

    spa.UseSpaPrerendering(options =>
    {
        options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.bundle.js";
        options.BootModuleBuilder = env.IsDevelopment()
            ? new AngularCliBuilder(npmScript: "build:ssr:en")
            : null;
        options.ExcludeUrls = new[] { "/sockjs-node" };
        options.SupplyData = (context, data) =>
        {
            data["foo"] = "bar";
        };
    });

    if (env.IsDevelopment())
    {
        spa.UseAngularCliServer(npmScript: "start");
    }
});

J'ai parcouru la documentation et les sources sur Github, et je ne trouve pas comment configurer ASP.net Core pour associer une route spécifique à un SPA donné. Quelqu'un a t-il une idée ?

Answer 1

Merci à SteveSandersonMS et chris5287 sur Github pour m'avoir indiqué la solution à ce problème.

IApplicationBuilder.Map peut séparer les chemins en différents domaines de préoccupation. Si vous enroulez un appel à app.UseSpa dans un appel à app.Map le SPA ne sera traité que pour le chemin spécifié par l'option Map appel. Le site app.UseSpa l'appel finit par ressembler à :

app.Map("/app1", app1 =>
{
    app1.UseSpa(spa =>
    {
        // To learn more about options for serving an Angular SPA from ASP.NET Core,
        // see https://go.microsoft.com/fwlink/?linkid=864501

        spa.Options.SourcePath = "ClientApp";

        spa.UseSpaPrerendering(options =>
        {
            options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.bundle.js";
            options.BootModuleBuilder = env.IsDevelopment()
                ? new AngularCliBuilder(npmScript: "build:ssr:en")
                : null;
            options.ExcludeUrls = new[] { "/sockjs-node" };
            options.SupplyData = (context, data) =>
            {
                data["foo"] = "bar";
            };
        });

        if (env.IsDevelopment())
        {
            spa.UseAngularCliServer(npmScript: "start --app=app1 --base-href=/app1/ --serve-path=/");
        }
    });
});

Vous pouvez faire autant d'appels à app.Map comme nécessaire pour configurer vos SPAs. Notez également la modification de l'option spa.UseAngularCliServer à la fin : vous devrez définir les paramètres suivants --base-href et --serve-path pour correspondre à votre configuration particulière.