IdentityServer4切换.NET 5运行后前端页面结构缺失如何解决？

问题根因 #

你看到的样式异常是IdentityServer4 UI依赖的CSS、JS等静态资源未成功加载导致的，核心问题是你的Startup.cs中缺少静态资源中间件的注册，且中间件顺序不符合要求。
ASP.NET Core默认不会自动启用静态资源访问，必须显式注册UseStaticFiles中间件才能读取wwwroot目录下的前端资源，你当前配置下浏览器请求样式文件时会返回404，页面仅渲染纯HTML结构，就会出现无样式的异常效果。

解决方案 #

修改Startup.cs中Configure方法的代码，补全UseStaticFiles中间件并调整中间件顺序，正确配置如下：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }

    // 启用静态资源访问，必须放在UseRouting、UseIdentityServer之前
    app.UseStaticFiles();

    app.UseRouting();

    app.UseIdentityServer();

    app.UseAuthorization();

    app.UseEndpoints(endpoints => endpoints.MapDefaultControllerRoute());
}

补充验证项 #

如果修改配置后问题仍存在，可以检查以下两点：

• 确认项目根目录下的wwwroot文件夹包含IdentityServer4 UI的所有静态资源，没有被意外排除在项目外
• 检查.csproj项目文件中是否存在<StaticWebAssetsEnabled>true</StaticWebAssetsEnabled>配置，开发环境下需要开启该配置才能正确读取静态资源

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