reactjs 在Elastic Beanstalk上运行ASP.NET Core + React的任何建议

oknwwptz  于 2023-05-17  发布在  React
关注(0)|答案(1)|浏览(189)

我正在尝试将带有ReactJS应用程序的ASP.NET Core部署到Amazon的Elastic Beanstalk。我一直在使用本教程来帮助我入门。我可以很好地部署教程(使用dotnet new web模板)项目。然而,当我发布一个ASP.NET Core + React项目(使用dotnet new react模板)时,我在尝试访问应用程序时遇到以下异常:

InvalidOperationException: The SPA default page middleware could not return the default page '/index.html' because it was not found, and no other middleware handled the request.
Your application is running in Production mode, so make sure it has been published, or that you have built your SPA manually. Alternatively you may wish to switch to the Development environment.
  • 这只发生在我尝试访问ClientApp/ React组件时。当我访问一个API端点时,没有任何问题。
  • 此外,在本地运行时不会发生这种情况。在本地运行效果良好。

为了重现这个错误,我执行了以下命令:

dotnet new react -o test-react/
dotnet publish test-react/ -o site/
cd site/
zip ../deploy.zip *

最后,我手动将deploy.zip导入AWS Elastic Beanstalk。
这是该项目的Startup.cs文件。

public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {

        services.AddControllersWithViews();

        // In production, the React files will be served from this directory
        services.AddSpaStaticFiles(configuration =>
        {
            configuration.RootPath = "ClientApp/build";
        });
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Error");
            // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
            app.UseHsts();
        }

        app.UseHttpsRedirection();
        app.UseStaticFiles();
        app.UseSpaStaticFiles();

        app.UseRouting();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllerRoute(
                name: "default",
                pattern: "{controller}/{action=Index}/{id?}");
        });

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

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

作为参考,我的目标是.NET Core 3.1。有什么办法解决这个问题吗?我相信我已经尝试了关于this GitHub问题的所有建议。任何帮助将不胜感激。
这个问题看起来很相似,但显然是针对Angular而不是React的:deploy Angular/Asp.Net Core 2.1 app to AWS: 500 error

pgx2nnw8

pgx2nnw81#

原来我的deploy.zip包没有被递归地创建,所以子目录中的文件丢失了。而不是做,

zip ../deploy.zip *

是的

zip -r ../deploy.zip *

其按预期工作。我真傻

相关问题