Everything is working fine locally. But when deployed to Azure, loading the css shows this error:
Resource interpreted as Stylesheet but transferred with MIME type text/plain
It happens in all the browsers.
The application loads a spa in react.
These are the middlewares I am using in this order.
if (Environment.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.UseStatusCodePagesWithReExecute("/Home/Error", "?statusCode={0}");
app.UseStaticFiles();
app.UseSpaStaticFiles();
app.UseOurCustomAuthenticate();
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller=Home}/{action}/{id?}");
routes.MapRoute(
name: "api",
template: "api/{controller}/{action}/{id?}");
});
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
if (Environment.IsDevelopment())
{
spa.UseReactDevelopmentServer(npmScript: "start");
}
});
The custom authenticate middleware that we are using checks if the path starts with "/styles" it will not do anything and let it load.
This is the cshtml file where I include the css file:
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" type="text/css" href="~/styles/notFound.css">
</head>
<body class="body-content">
This is where the styles and images are
The image is being loaded properly on the server, only the style have this problem.
So in my custom middleware I did this:
if (httpContext.Request.Path.StartsWithSegments("/styles"))
{
httpContext.Response.ContentType = "text/css";
}
Now the content-type is correct in the network tab, but the style is not still loading. When I click on the css file it is an empty file.
I have read a lot of posts regarding this issue, but couldn't still solve it.
