Как заставить приложение ASP.NET/React обслуживать SPA из подпути?

Question

У меня есть приложение aspnetcore и reactjs, созданное из начального шаблона (dotnet new react).Я бы хотел, чтобы приложение SPA обслуживалось из подпути вне корневого URL;например, вместо примера приложения https://localhost:5001/counter я ищу его вместо https://localhost:5001/myapp/counter.

Я изменил Startup.cs с:

app.UseSpa(spa =>
            {
                spa.Options.SourcePath = "ClientApp";

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

на это:

app.Map(new Microsoft.AspNetCore.Http.PathString("/myapp"), appMember =>
            {
                appMember.UseSpa(spa =>
                {
                    spa.Options.SourcePath = "ClientApp";

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

Такого рода работы.Если я перехожу к https://localhost:5001/myapp/, кажется, что он загружает index.html, но статические файлы пытаются загрузить из корневого пути, а не из подпути.

Что необходимо изменить, чтобы приложение реагирования использовало подпуть в качестве корневого?Я бы хотел, чтобы это работало как в интерактивной среде VS dev, так и при развертывании, вероятно, в IIS.Кажется, что это близко, но я что-то упустил.

Пример демонстрации решения доступен здесь: https://github.com/petertirrell/mvc-spa-demo/tree/master/mvc-spa-demo

Спасибо!

Answer 1

Вы можете сделать это, указав RequestPath в параметрах статического файла. Ниже код может работать для вас

        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            app.UseStaticFiles(new StaticFileOptions
            {
                FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "Client")),
                RequestPath = "/client"
            });
         }