Getting following error while running Core Angular 6 SPA application :
The value for MIME type is blank :
Index.html File :
<html lang="en">
<head>
<meta charset="utf-8">
<title>APP</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root>
<div id="startup-message">
<h1></h1>
<p><span></span></p>
</div>
</app-root>
</body>
</html>
Package.JSON :
Customer Headers added in Web.Config file :
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
<add name="X-Content-Type-Options" value="nosniff" />
</customHeaders>
Getting following error while running Core Angular 6 SPA application :
The value for MIME type is blank :
Index.html File :
<html lang="en">
<head>
<meta charset="utf-8">
<title>APP</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root>
<div id="startup-message">
<h1></h1>
<p><span></span></p>
</div>
</app-root>
</body>
</html>
Package.JSON :
Customer Headers added in Web.Config file :
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
<add name="X-Content-Type-Options" value="nosniff" />
</customHeaders>
- 99% of the time, this error is server is not giving you the files that angular is requesting js/css/fonts/images – Joy Biswas Commented Oct 1, 2019 at 0:48
-
Your urls seem wrong. The default templates are setup in a way to expect the js files from
~/dist/xxx.js, not~/xxx.js. The SPA middleware will watch for urls starting with~/distand intercept it, to serve the on-the-fly generated files for hot module replacement functionality – Tseng Commented Oct 1, 2019 at 3:13 - @Tseng so what is the solution ? – S2K Commented Oct 1, 2019 at 4:07
- @SagarK where are bundles getting generated? Outside dist folder? – Vinay sharma Commented Oct 1, 2019 at 7:43
- Not sure of your setup. The ASP.NET Core templates set up the bundle generation out of the box (the build scripts are set within the csproj as Build Tasks). I assume you used your own build pipeline or changed the index.html or Home/Index.cshtml where the *.js files are embedded – Tseng Commented Oct 1, 2019 at 11:06
2 Answers
Reset to default 2I could not reproduce your problem.You could create a new asp,net core and Angular template app to check whether the problem exists and pare the files.
It is likely that you have wrong url for the js files.
Besides,X-Content-Type option: nosniff tells the browser to force the MIME of the resource to be loaded.Try to ment out that.
Refer to Disable Chrome strict MIME type checking
Make sure you configure your static files BEFORE you configure your routes. In other words, something like this:
app.UseHttpsRedirection();
// nb: configure this first!!
app.UseStaticFiles();
if (!env.IsDevelopment())
{
app.UseSpaStaticFiles();
}
app.UseRouting();
app.UseAuthentication();
app.UseAuthorization();
app.UseEndpoints(endpoints =>
{
endpoints.MapControllers();
});
app.UseSpa(spa =>
{
spa.Options.SourcePath = "ClientApp";
spa.Options.StartupTimeout = new TimeSpan(0, 5, 0);
if (env.IsDevelopment())
{
spa.UseAngularCliServer(npmScript: "start");
}
});