ASP.NET 7中如何为JS文件设置正确的Content-Type？

你的问题出在当前的自定义中间件上——它会拦截所有请求，不管是访问根路径还是.js脚本，都直接返回index.html并设置text/html的Content-Type，这就导致脚本请求也被当成HTML文件处理，自然不会有正确的application/javascript类型。

正确的做法是使用ASP.NET内置的静态文件中间件，它会自动根据文件扩展名匹配对应的Content-Type，完全不用手动处理。以下是修改后的代码：

基础解决方案（文件放在默认wwwroot目录） #

把你的index.html和脚本文件都放到项目的wwwroot文件夹下（ASP.NET默认的静态文件根目录），然后修改Program.cs：

var builder = WebApplication.CreateBuilder(args);
var app = builder.Build();

// 启用静态文件中间件，自动处理不同扩展名的Content-Type
app.UseStaticFiles();

// 配置默认文件，访问根路径时自动返回index.html
app.UseDefaultFiles(new DefaultFilesOptions
{
    DefaultFileNames = new List<string> { "index.html" }
});

app.Run();

自定义静态文件根目录（如果不想用wwwroot） #

如果你的文件放在项目根目录而非wwwroot，可以指定静态文件的来源目录：

using Microsoft.Extensions.FileProviders;
using System.IO;

var builder = WebApplication.CreateBuilder(args);
var app = builder.Build();

// 指定当前项目目录为静态文件根目录
app.UseStaticFiles(new StaticFileOptions
{
    FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), ".")),
    RequestPath = ""
});

// 配置默认文件
app.UseDefaultFiles(new DefaultFilesOptions
{
    FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), ".")),
    DefaultFileNames = new List<string> { "index.html" }
});

app.Run();

自定义Content-Type映射（可选） #

如果需要修改或添加特定扩展名的Content-Type映射，可以自定义FileExtensionContentTypeProvider：

using Microsoft.AspNetCore.StaticFiles;
using Microsoft.Extensions.FileProviders;
using System.IO;

var builder = WebApplication.CreateBuilder(args);
var app = builder.Build();

var contentTypeProvider = new FileExtensionContentTypeProvider();
// 确保.js文件映射到正确的类型（默认已经是，这里作为示例）
contentTypeProvider.Mappings[".js"] = "application/javascript";
// 可以添加自定义扩展名，比如：contentTypeProvider.Mappings[".myext"] = "application/octet-stream";

app.UseStaticFiles(new StaticFileOptions
{
    FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), ".")),
    RequestPath = "",
    ContentTypeProvider = contentTypeProvider
});

app.UseDefaultFiles(new DefaultFilesOptions
{
    FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), ".")),
    DefaultFileNames = new List<string> { "index.html" }
});

app.Run();

为什么原来的代码不行？ #

你写的自定义中间件没有区分请求路径，所有进来的请求都会返回index.html的内容并设置text/html类型，包括浏览器请求.js脚本的请求。而静态文件中间件会先检查请求路径对应的文件是否存在，然后根据文件扩展名自动设置正确的Content-Type，完美解决你的问题。

内容的提问来源于stack exchange，提问作者michasaucer