.NET Framework 4.8下ASP.NET MVC静态文件无法渲染排查求助

我正在排查基于.NET Framework 4.8的ASP.NET MVC应用问题：运行时所有静态文件返回200状态码，但浏览器无法渲染这些文件，页面加载后呈空白状态，仅页面标题和favicon可见。

相关代码文件 #

BundleConfig.cs #

using System.Web.Optimization;

namespace XYZ.Web
{
    public class BundleConfig
    {
        // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js",
                      "~/Scripts/respond.js"));

            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/site.css"));

            // Set EnableOptimizations to false for debugging. For more information,
            // visit http://go.microsoft.com/fwlink/?LinkId=301862
            BundleTable.EnableOptimizations = true;
        }
    }
}

Global.asax.cs #

using Autofac;
using Autofac.Integration.Mvc;
using XYZ.Library.Services;
using System.Web.Http;
using System.Web.Mvc;
using System.Web.Optimization;
using System.Web.Routing;

namespace XYZ.Web
{
    public class WebApiApplication : System.Web.HttpApplication
    {
        protected void Application_Start()
        {
            AreaRegistration.RegisterAllAreas();
            GlobalConfiguration.Configure(WebApiConfig.Register);
            RouteConfig.RegisterRoutes(RouteTable.Routes);
            BundleConfig.RegisterBundles(BundleTable.Bundles);
            RegisterAutofac();
        }
        private void RegisterAutofac()
        {
            var builder = new ContainerBuilder();
            //Register MVC controllers
            builder.RegisterControllers(typeof(WebApiApplication).Assembly);

            //Register IUserService
            builder.RegisterType<UserService>().As<IUserService>().InstancePerRequest();

            //Set the dependency resolver to Autofac
            var container = builder.Build();
            DependencyResolver.SetResolver(new AutofacDependencyResolver(container));
        }
    }
}

Views/Home/Index.cshtml #

@{
    Layout = null;
}
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">

    <meta name="theme-color" content="#000000">
    <link rel="manifest" href="/manifest.json">
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
    <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700" rel="stylesheet" async>
    <link async rel="stylesheet" href="/css/ionicons.min.css">
    <link rel="stylesheet" href="https://unpkg.com/react-instantsearch-theme-algolia@4.0.0/style.min.css">
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==" crossorigin="" async />
    <title>XYZ/title>
    <link href="/static/css/main.c764a889.chunk.css" rel="stylesheet">
</head>
<body>
    <script type="text/javascript">
        window.XYZ= {};
        window.XYZ.apiBaseUrl = '/api';
        window.XYZ.loginUrl = '/';
        window.XYZ.version = '2.2';
        window.XYZ.tokenUrl = '/Login';
    </script>
    <noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div>
    <script type="text/javascript" src="/static/js/main.1cf49c64.chunk.js"></script>
</body>
</html>

RouteConfig.cs #

using System.Web.Mvc;
using System.Web.Routing;

namespace XYZ.Web
{
    public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
            name: "Default",
            url: "{*url}",
            defaults: new { controller = "Home", action = "Index" }
        );
        }
    }
}

问题原因及解决方法 #

核心问题：路由拦截了静态文件请求 #

你的RouteConfig.cs中使用了{*url}的通配符默认路由，这会匹配所有请求，包括静态文件（如/static/js/main.1cf49c64.chunk.js、/static/css/main.c764a889.chunk.css）的请求。ASP.NET MVC会把这些请求转发到Home/Index视图，返回的是HTML页面内容而非真正的静态文件内容。浏览器拿到HTML却当作JS/CSS解析，自然无法渲染页面，导致空白。

解决方案1：添加静态文件路径忽略规则 #

修改RouteConfig.cs，明确忽略静态文件路径的请求：

using System.Web.Mvc;
using System.Web.Routing;

namespace XYZ.Web
{
    public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
            // 忽略静态资源路径
            routes.IgnoreRoute("static/{*pathInfo}");
            routes.IgnoreRoute("css/{*pathInfo}");
            routes.IgnoreRoute("manifest.json");
            
            routes.MapRoute(
            name: "Default",
            url: "{*url}",
            defaults: new { controller = "Home", action = "Index" }
        );
        }
    }
}

解决方案2：让静态文件模块优先处理请求 #

设置RouteExistingFiles为false，确保已存在的静态文件请求由静态文件模块处理，而非路由：

public static void RegisterRoutes(RouteCollection routes)
{
    routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
    // 允许静态文件模块优先处理已存在的文件
    routes.RouteExistingFiles = false;

    routes.MapRoute(
    name: "Default",
    url: "{*url}",
    defaults: new { controller = "Home", action = "Index" }
);
}

额外修复：HTML标签语法错误 #

Index.cshtml中的<title>标签未正确闭合，修改为：

<title>XYZ</title>

我已尝试更换静态文件、检查解决方案中所有项目文件是否存在，也尝试将BundleTable.EnableOptimizations设置为false运行应用，但问题仍未解决。

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