CSS中Unicode字符偶现乱码(â–¾)问题求助

• 页面刷新时约1%概率出现Unicode字符乱码，具体显示为â–¾，受影响的是DataTables列排序指示器和复选框勾选标记
• 项目采用DataTables+Bootstrap5集成方案，异常字符的定义来自dataTables.bootstrap5.css；出现问题时网络无异常，CSS文件已正常传输到客户端，但文件内容存在损坏（可参考附图中开发者工具的对比结果）
• 后端基于ASP.NET Core 7 MVC，页面<head>标签内已配置<meta charset="utf-8" />以指定UTF-8编码
• 曾尝试将CSS中的箭头替换为"0d8"（向上caret符号），但显示为方块

• 强制CSS文件以UTF-8编码传输：在ASP.NET Core的Program.cs中配置静态文件响应头，明确指定CSS文件的编码为UTF-8，避免客户端解析时出现编码偏差：

  app.UseStaticFiles(new StaticFileOptions
  {
      OnPrepareResponse = ctx =>
      {
          if (ctx.File.Name.EndsWith(".css", StringComparison.OrdinalIgnoreCase))
          {
              ctx.Context.Response.Headers.ContentType = "text/css; charset=utf-8";
          }
      }
  });
  

• 校验服务器端CSS文件编码：确认服务器上存储的dataTables.bootstrap5.css文件是以UTF-8无BOM格式保存的，文件本身的编码错误会直接导致客户端解析乱码
• 替换为CSS图标替代Unicode字符：放弃使用Unicode字符作为UI指示器，改用Bootstrap内置图标或自定义SVG图标，通过CSS伪元素引入，从根源避免字符编码问题：

  /* 示例：用Bootstrap向下箭头图标替换排序指示器 */
  .dataTable thead th.sorting::after {
      content: "";
      display: inline-block;
      width: 12px;
      height: 12px;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
      background-size: cover;
      margin-left: 6px;
      vertical-align: middle;
  }
  

• 检查静态文件压缩配置：如果服务器启用了Gzip/Brotli等压缩机制，确认压缩过程未破坏CSS文件的UTF-8编码结构，部分压缩工具会因编码识别错误导致文件损坏

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