ASP.NET Core and Angular Deployment - page refresh gives 404 error

Question

I am working on a project in Angular and ASP.NET Core hosted on Plesk. The project is working fine except the page refresh yields the 404 page not found error. Whenever I hit refresh from the browser or reload the page, it gives the 404 error.

The structure of the files it's in the picture below.

The content in web.config is:

In the "wwwroot" folder I have the build from Angular, where I created a "web.config" file with the following content:

Also in the "wwwroot" folder, I have the "index.html" file with the following content:

Please guide me to solve this issue.

Thanks!

Welcome on StackOverflow ! Please don't show picture of code but prefer copy/paste and format them — Elikill58, Mar 23 '22 at 10:42

score 1 · Answer 1 · answered May 12 '22 at 19:57

I ran in the same problem last night, but with a Vue application that uses ASP .net 6.0 in the backend. The reason of the error is well explained here, but I used a different solution to solve this problem.

My solution was adding a MapFallbackTocontroller controller in program.cs:

app.MapControllers();
app.MapFallbackToController("Index", "Fallback");

await app.RunAsync();

and then creating said FallbackController.cs:

[AllowAnonymous]
public class FallbackController : Controller
{
   public IActionResult Index()
   {
      return PhysicalFile(Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "index.html"), "text/html");
   }
}

Microtechie · Answer 2 · 2023-04-17T19:01:51.753

Net 6 and angular spa application refresh 404 issue appears.Along with index html changes add below lines in program/startup.cs refreshing issue fixed . snippet mentioned here

app.Use(async (context, next) =>{
            await next();
            if (context.Response.StatusCode == 404 && !Path.HasExtension(context.Request.Path.Value))
            {
                context.Request.Path = "/index.html";
                await next();
            }
        });

score 0 · Answer 3 · answered Mar 22 '22 at 20:31

0

Did you try adding

 <action type="Rewrite" url="./index.html" />

instead of

 <action type="Rewrite" url="/" />

answered Mar 22 '22 at 20:31

Danielle

1,386
8
22

Still the same error – Costin Mar 22 '22 at 20:34

score 0 · Answer 4 · answered Jun 26 '23 at 13:50

0

This did it for me:

// Configure endpoints
app.UseEndpoints(endpoints =>
{
    // your other endpoint mappings...
    endpoints.MapFallbackToFile("index.html");
});

answered Jun 26 '23 at 13:50

flowest

129
2
10

ASP.NET Core and Angular Deployment - page refresh gives 404 error

4 Answers4