Asp.net core 2.1 - 如何服务多个角度应用程序？

Posted 2023-03-09

【中文标题】Asp.net core 2.1 - 如何服务多个角度应用程序？

【英文标题】：Asp.net core 2.1 - How to serve multiple angular apps?

【发布时间】：2019-08-10 21:23:00

【问题描述】：

我正在尝试从我的 .net 核心服务中提供 2 个 Angular 应用程序，如下所示：

public void ConfigureServices(IServiceCollection services)

    ...

    services.AddSpaStaticFiles(configuration =>
    
        configuration.RootPath = "wwwroot/app";
    );

    services.AddSpaStaticFiles(configuration =>
    
        configuration.RootPath = "wwwroot/admin";
    );

    ...


public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)

    ...

    app.UseSpaStaticFiles(new StaticFileOptions
    
        OnPrepareResponse = ctx =>
        
            ctx.Context.Response.Headers.Append("Cache-Control", "public,max-age=0");
        
    );

    app.UseMvc();

    app.Map("/app", client =>
    
        client.UseSpa(spa =>
        
            spa.Options.SourcePath = "wwwroot/app";
        );
    ).Map("/admin", admin =>
    
        admin.UseSpa(spa =>
        
            spa.Options.SourcePath = "wwwroot/admin";
        );
    );

在文件系统中，我只有这些应用程序的dist 输出（因为它们是由另一个团队开发的）。所以它看起来像这样：

C:[我的项目路径]\wwwroot\app C:[我的项目路径]\wwwroot\admin

但由于某种原因，管理应用程序可以正常工作，而该应用程序不能正常工作，而且它不支持默认页面，因此我需要输入带有 /index.html 的 URL。

关于如何解决这个问题的任何想法？

【参考方案1】：

好吧，我终于解决了，它的工作原理是这样的：

public void ConfigureServices(IServiceCollection services)

    ...

    services.AddSpaStaticFiles();

    ...


public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)

    ...

    app.UseSpaStaticFiles(new StaticFileOptions
    
        FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "wwwroot"))
    );

    app.UseMvc();

    app.Map("/app", client =>
    
        client.UseSpa(spa =>
        
            spa.Options.SourcePath = "wwwroot/app";
            spa.Options.DefaultPageStaticFileOptions = new StaticFileOptions
            
                FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "wwwroot/app"))
            ;
        );
    ).Map("/admin", admin =>
    
        admin.UseSpa(spa =>
        
            spa.Options.SourcePath = "wwwroot/admin";
            spa.Options.DefaultPageStaticFileOptions = new StaticFileOptions
            
                FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "wwwroot/admin"))
            ;
        );
    );

另外，不要忘记进入每个应用程序的index.html 文件并相应地设置base 标签，如下所示：

//for the client application:
<base href="/app/">

//for the admin application
<base href="/admin/">

【讨论】：

感谢您花时间发布答案。我猜这为我节省了很多时间。

不客气。我很高兴听到它对其他人也有用。

在我看来比this 更好的答案，因为它提到了base href

【参考方案2】：

立然回答了他自己的问题。 就我而言，我有多个 vue cli 站点的入口点。该修复与正确答案相同，但也设置 spa.Options.DefaultPage。

    app
         .Map("/login", admin =>
         
             admin.UseSpa(spa =>
             
                 spa.Options.SourcePath = "ClientApp";
                 spa.Options.DefaultPage = "/login.html";
             );
         )
        .Map("", client =>
    
        client.UseSpa(spa =>
        
            spa.Options.SourcePath = "ClientApp";
            spa.Options.DefaultPage = "/index.html";
        );
    );