Question

我有一个ASP.NET Core 2.1，我需要为多个Angular应用程序设置工作区，并使用以下路由：

http://someurl.com/main - ＆gt;第一个应用
http://someurl.com/admin - ＆gt;第二个应用程序

我使用function createUser(newUser) { userService.create(newUser) // Post creating new user .then(function(){ alert('Why do I come up before completion of the userService.create() function ?'); }); }进行以下设置：

angular-cli.json

我一直在尝试在"apps": [ { "root": "src", "outDir": "dist", "assets": [ "assets" ], "index": "index.html", "main": "main.ts", "polyfills": "polyfills.ts", "test": "test.ts", "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "app", "styles": [ "styles.css", "../node_modules/bootstrap/dist/css/bootstrap.min.css" ], "scripts": [], "environmentSource": "environments/environment.ts", "environments": { "dev": "environments/environment.ts", "prod": "environments/environment.prod.ts" } }, { "root": "src2", "outDir": "dist2", "assets": [ "assets" ], "index": "index.html", "main": "main.ts", "polyfills": "polyfills.ts", "test": "test.ts", "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "app", "styles": [ "styles.css", "../node_modules/bootstrap/dist/css/bootstrap.min.css" ], "scripts": [], "environmentSource": "environments/environment.ts", "environments": { "dev": "environments/environment.ts", "prod": "environments/environment.prod.ts" } }中设置映射，如下所示：

Startup.cs

使用app.Map("/main", l => { 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"; if (env.IsDevelopment()) { spa.UseAngularCliServer(npmScript: "start"); } }); }); app.Map("/admin", l => { 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}/dist2/main.bundle.js"; options.BootModuleBuilder = env.IsDevelopment() ? new AngularCliBuilder(npmScript: "build2") : null; }); if (env.IsDevelopment()) { spa.UseAngularCliServer(npmScript: "start2"); } }); });中的以下脚本：

project.json

}

当我启动解决方案主应用程序工作时，但当我尝试转到 admin 时，我失败了，错误：

错误：无法匹配任何路线。网址细分：'admin'错误：不能匹配任何路线。

请告诉我错过了什么并且做错了我的目标谢谢你的建议！

Answer 1

您正在app而非映射路径上注册单页应用程序（SPA）：

app.Map("/admin", l =>
{
    app.UseSpa(spa =>

将app更改为l可解决此问题：

app.Map("/admin", l =>
{
    l.UseSpa(spa =>

Answer 2

实时处理这种情况后，终于找到了可行的解决方案。

源代码：https://github.com/alpitg/.NetCoreSpa

重要步骤： 1.在Configure（）下的Startup.cs文件中，使用以下代码，

           // for each angular client we want to host use following map function
            app.Map(new PathString("newui"), client =>
            {

                string oldUiPath = env.IsDevelopment() ? "NewUI" : @"NewUI/dist";

                // Each map gets its own physical path
                // for it to map the static files to. 
                StaticFileOptions olduiDist = new StaticFileOptions()
                {
                    FileProvider = new PhysicalFileProvider(
                            Path.Combine(Directory.GetCurrentDirectory(), oldUiPath)
                        )
                };

                // Each map its own static files otherwise
                // it will only ever serve index.html no matter the filename 
                client.UseSpaStaticFiles(olduiDist);


                client.UseSpa(spa =>
                {
                    spa.Options.StartupTimeout = new TimeSpan(0, 5, 0);
                    spa.Options.SourcePath = "NewUI";

                    if (env.IsDevelopment())
                    {
                        // it will use package.json & will search for start command to run
                        spa.UseAngularCliServer(npmScript: "start");
                    }
                    else
                    {
                        spa.Options.DefaultPageStaticFileOptions = olduiDist;
                    }

                });
            });

package.json文件更改

    "start": "ng serve --servePath / --baseHref /newui/",
    "build": "ng build --baseHref /newui/",
    "build:ssr": "npm run build --baseHref /newui/ -- --app=ssr --output-hashing=media",

这些是我在这里分享的主要更改。有关更多详细信息，请使用来源并比较您的更改。

注意：已在.net core 2.2和angular 7上进行了测试

  [https://wayeasier.home.blog/2019/07/21/hosting-two-angular-app-behind-net-core-web-application/][2]

Answer 3

@ sven.to的答案有效，我只是在此处粘贴了完整的代码片段，以便于理解：

        app.Map("/foo", l => l.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";

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

这将添加/foo前缀，现在https://localhost:44383/foo/main.js将向您显示main.js，而https://localhost:44383/main.js将给您404 Not Found。

ASP.NET Core多角度应用程序

3 个答案: