App Service deployed successfully, but fails to find index.html

Question

I have a .Net API that hosts a Vue SPA. I previously deployed successfully to my Azure App Service, but after an update to the Vue app subsequent deployments all fail to correctly deploy the front end and I receive the error:

System.InvalidOperationException: The SPA default page middleware could not return the default page '/index.html' because it was not found

The API works, I can make requests with PostMan and they succeed.

Here is the Configure method from Startup.cs and here is the GitHub repo if you would like to look at other parts of the code. Let me know if other info would help.

public void Configure(IApplicationBuilder app, IWebHostEnvironment env, CricketCreationsContext cricketCreationsContext)
        {
            cricketCreationsContext.Database.Migrate();

            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            if (env.IsProduction())
            {
                app.UseHttpsRedirection();
            }

            app.UseDefaultFiles();
            app.UseRouting();
            app.UseSpaStaticFiles();
            app.UseAuthentication();
            app.UseAuthorization();
            app.UseStaticFiles();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllers();
                endpoints.MapFallbackToFile("/index.html");
            });

            app.UseSpa(spa =>
            {
                if (env.IsDevelopment())
                {
                    spa.Options.SourcePath = "clientapp";
                }
                else
                {
                    spa.Options.SourcePath = "clientapp/dist";
                }
            });
        }

After digging further. I've found that the SPA files are not being copied with the deployment. I tried to add this, but it didn't hel:

app.UseStaticFiles(new StaticFileOptions
            {
                FileProvider = new PhysicalFileProvider(Path.Combine(env.ContentRootPath, "clientapp")),
                RequestPath = "/clientapp",
            });

Thanks in advance for all your help!

Answer 1

Hi @Michael ,

With regards to

System.InvalidOperationException: The SPA default page middleware could not return the default page '/index.html' because it was not found

You don't have an index.html in your wwwroot folder. But you said it initially worked but stopped after making a change. What was the change? When you browse to the app service file system, do you see the files from your client/dist folder?

Answer 2

you need to add app.MapFallbackToFile("index.html"); after app.UseSpa()