40

我有一个 Angular 5 应用程序，我想使用最新的Angular 模板 RC在 ASP.net Core 上托管 Angular Universal 。我已经按照文档并启动并运行了应用程序。问题是我也在使用 Angular 的i18n 工具，它产生多个编译的应用程序，每个语言环境 1 个。我需要能够从https://myhost.com/{locale}/.

我知道我可以为每个语言环境启动一个 ASP.net Core 应用程序的实例，并在网络服务器中设置托管以使适当的路径路由到关联的应用程序，但这对我来说似乎太过分了。

路由配置为：

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

SpaServices 配置有：

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

我查看了 Github 上的文档和源代码，但找不到如何配置 ASP.net Core 以将特定路由与给定 SPA 关联。有人有想法么？

4

1 回答 1

41

感谢Github 上的SteveSandersonMS和chris5287为我指出了解决方案。

IApplicationBuilder.Map可以将路径分成不同的关注领域。如果您在对 的调用中包装对app.UseSpa的调用app.Map，则 SPA 将仅针对Map调用指定的路径进行处理。电话最终app.UseSpa看起来像：

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

您可以根据需要进行尽可能多的调用app.Map来配置您的 SPA。还要注意最后对spa.UseAngularCliServer调用的修改：您需要设置--base-href并--serve-path匹配您的特定配置。

于 2018-01-26T16:38:48.957 回答