为何Azure Front Door会破坏HttpHandler中设置的Content-Type头？

问题背景 #

我们基于.NET 4.8运行ASP.NET MVC5应用，自定义IHttpHandler为静态文件添加CORS头。未部署Azure Front Door时一切正常，但用上Front Door后，只要触发该HttpHandler，静态文件的Content-Type头就会丢失——哪怕跳过添加CORS头的逻辑，问题依然存在。直接导致静态文件加载失败，报错：

Refused to execute script from 'https://example.com/Scripts/select2.full.js' because its MIME type ('') is not executable, and strict MIME type checking is enabled.

用到的代码与配置 #

HttpHandler代码

public class CorsHttpHandler : IHttpHandler
{
    protected RequestContext RequestContext { get; set; }

    public CorsHttpHandler() : base() { }

    public CorsHttpHandler(RequestContext requestContext)
    {
        this.RequestContext = requestContext;
    }

    public void ProcessRequest(HttpContext context)
    {
        if (ConfigHelper.IsUsingAccessControlAllowOrigin && !context.Response.Headers.AllKeys.Any(x => x.Equals(ConfigHelper.AccessControlAllowOriginKey, StringComparison.OrdinalIgnoreCase)))
        {
            context.Response.AddHeader(ConfigHelper.AccessControlAllowOriginKey, ConfigHelper.WildCardAsterik);
        }
    }

    public bool IsReusable
    {
        get { return false; }
    }
}

web.config配置

<add name="CorsHttpHandlerCss" 
     verb="*" path="*.css" 
     type="Example.Mvc.Handlers.CorsHttpHandler, Example.Mvc" 
     preCondition="managedHandler" />
<add name="CorsHttpHandlerJs" 
     verb="*" path="*.js" 
     type="Example.Mvc.Handlers.CorsHttpHandler, Example.Mvc" 
     preCondition="managedHandler" />
<add name="CorsHttpHandlerJpg" 
     verb="*" path="*.jpg" 
     type="Example.Mvc.Handlers.CorsHttpHandler, Example.Mvc" 
     preCondition="managedHandler" />
<add name="CorsHttpHandlerPng" 
     verb="*" path="*.png" 
     type="Example.Mvc.Handlers.CorsHttpHandler, Example.Mvc" 
     preCondition="managedHandler" />

问题根源 #

核心问题出在请求管道的处理逻辑上：

• 默认情况下，静态文件由IIS的静态文件模块处理，会自动设置Content-Type等响应头。
• 配置preCondition="managedHandler"后，请求被托管管道接管，但我们的HttpHandler只执行了加头操作，没有将请求交还给后续的静态文件处理流程——相当于打断了IIS原本的静态文件处理逻辑。
• 无Front Door时，IIS可能在后续管道阶段补全缺失的响应头，但Front Door会严格按照应用服务返回的响应头缓存/转发，缺失的Content-Type不会被自动补全，最终导致客户端报错。

解决方案 #

方案1：修改HttpHandler，让静态文件处理继续执行 #

在ProcessRequest方法末尾，将请求重新映射到IIS的静态文件处理程序，确保Content-Type等响应头能正常生成：

public void ProcessRequest(HttpContext context)
{
    // 保留原有CORS头添加逻辑
    if (ConfigHelper.IsUsingAccessControlAllowOrigin && !context.Response.Headers.AllKeys.Any(x => x.Equals(ConfigHelper.AccessControlAllowOriginKey, StringComparison.OrdinalIgnoreCase)))
    {
        context.Response.AddHeader(ConfigHelper.AccessControlAllowOriginKey, ConfigHelper.WildCardAsterik);
    }

    // 将请求交还给IIS静态文件处理程序
    context.RemapHandler(new System.Web.StaticFileHandler());
}

方案2：改用HttpModule替代HttpHandler（推荐） #

HttpModule无需接管整个请求处理，仅在管道中插入逻辑，更适合仅添加响应头的场景：

1. 实现自定义HttpModule：

public class CorsHttpModule : IHttpModule
{
    public void Init(HttpApplication context)
    {
        // 在释放请求状态后添加头，避免干扰静态文件处理
        context.PostReleaseRequestState += OnPostReleaseRequestState;
    }

    private void OnPostReleaseRequestState(object sender, EventArgs e)
    {
        var app = (HttpApplication)sender;
        var context = app.Context;
        
        // 仅针对指定静态文件类型处理
        var fileExt = Path.GetExtension(context.Request.FilePath).ToLower();
        var targetExts = new[] { ".css", ".js", ".jpg", ".png" };
        if (targetExts.Contains(fileExt))
        {
            if (ConfigHelper.IsUsingAccessControlAllowOrigin && !context.Response.Headers.AllKeys.Any(x => x.Equals(ConfigHelper.AccessControlAllowOriginKey, StringComparison.OrdinalIgnoreCase)))
            {
                context.Response.AddHeader(ConfigHelper.AccessControlAllowOriginKey, ConfigHelper.WildCardAsterik);
            }
        }
    }

    public void Dispose() { }
}

2. 在web.config中注册模块：

<system.webServer>
    <modules>
        <add name="CorsHttpModule" type="Example.Mvc.Modules.CorsHttpModule, Example.Mvc" />
    </modules>
</system.webServer>

这种方式完全不干扰IIS对静态文件的默认处理，Content-Type由IIS正常设置，同时完成CORS头添加，在Front Door环境下稳定可靠。

方案3：移除HttpHandler的preCondition #

删除web.config中HttpHandler的preCondition="managedHandler"，让非托管静态文件模块先处理请求，再由托管HttpHandler添加头：

<add name="CorsHttpHandlerCss" 
     verb="*" path="*.css" 
     type="Example.Mvc.Handlers.CorsHttpHandler, Example.Mvc" />
<!-- 其他Handler配置同理移除preCondition -->

但此方式会让所有静态文件请求走托管管道，可能影响性能，优先级低于前两个方案。

验证步骤 #

1. 直接访问应用服务域名（绕开Front Door），检查静态文件的Content-Type是否正常。
2. 通过Front Door域名访问，确认响应头完整，文件能正常加载。

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