How to configure ASP.net Core server routing for multiple SPA centers hosted by spa services

Question

I have an Angular 5 application that I want to host using Angular Universal on ASP.net Core using the latest Angular template RC . I followed the documents and ran the application. The problem is that I also use Angular i18n tools , which produce several compiled applications, 1 per locale. I need to be able to post each one https://myhost.com/{locale}/.

I know that I can deploy an instance of the ASP.net Core application for each locale and configure hosting on the web server to have a suitable path to the corresponding application, but this seems excessive to me.

Routes are configured using:

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

Spa services configured with:

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

I looked through the documentation and source on Github, and I cannot find how to configure ASP.net Core to associate a specific route with this SPA. Does anyone have any idea?

Answer 1

Thanks to SteveSandersonMS and chris5287 on Github for pointing out a solution to this.

IApplicationBuilder.Mapcan highlight paths to various areas of concern. If you end the call app.UseSpawith the call app.Map, the SPA will only be processed for the path indicated by the call Map. The call is app.UseSpaas follows:

app.Map("/app1", app1 =>
{
    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 --app=app1 --base-href=/app1/ --serve-path=/");
        }
    });
});

app.Map, , SPA. spa.UseAngularCliServer : --base-href --serve-path .