thinkphp 5.1 静态缓存导致字体图标不显示，主因是缓存固化了错误路径、污染响应头或干扰字体加载；应改用绝对路径、检查字体文件可访问性与响应头、设置 font-display: swap、清理双层缓存并排除本地字体干扰。
ThinkPHP 5.1 开启静态缓存后字体图标不显示，问题通常不在缓存机制本身，而是缓存干扰了字体资源的加载路径、响应头或执行顺序。核心矛盾是：静态缓存会将 HTML 内容固化为文件，而字体图标依赖的 @font-face 规则、相对路径、CORS 响应头等，在缓存生成时若环境异常（如路径错位、header 被截断），就会导致 Safari/Chrome 等浏览器无法正确加载字体文件。
检查字体文件路径是否被缓存“固化”错误
静态缓存保存的是最终渲染出的 HTML 字符串。如果模板中字体路径写成相对路径（如 src: url(../fonts/icon.woff2)），而缓存是在某级子目录下生成的，该路径在其他 URL 下就会失效。
- 统一改用绝对路径：
url(/static/fonts/icon.woff2)，确保无论从哪个路由访问，路径都指向同一位置 - 在
application/config/template.php的tpl_replace_string中定义'__FONT__' => '/static/fonts/'，模板中写url(__FONT__icon.woff2) - 检查 public/static/fonts/ 目录是否存在且可直接通过浏览器访问（如打开
https://yoursite.com/static/fonts/icon.woff2应返回二进制内容）
确认响应头未被缓存污染
字体文件需返回正确的 Content-Type（font/woff2）和 Access-Control-Allow-Origin（跨域场景）。但静态缓存可能让 Nginx 或 PHP 输出了额外空格、BOM 或 warning，导致 header 发送失败。
- 打开浏览器开发者工具 → Network → 切换到 Fonts 类型 → 查看字体请求的 Response Headers，确认有
Content-Type: font/woff2和Access-Control-Allow-Origin: *（或对应域名） - 若字体请求状态为 “Failed” 或 “Blocked”，检查 public/index.php 开头是否加了
ob_clean()—— 静态缓存期间若有前置输出，会破坏 header - 禁用静态缓存临时测试：注释掉路由中的
->cache(...)，刷新页面看字体是否恢复；若恢复，说明缓存过程触发了输出污染
排除本地字体与 font-display 干扰
TP5.1 静态缓存不会改变 CSS 渲染逻辑，但会放大 Safari 等浏览器对字体加载策略的敏感性。
- CSS 中
@font-face必须显式设置font-display: swap，避免首屏图标空白 - 检查系统字体册（macOS 字体册 App）是否安装了同名图标字体（如 FontAwesome），Safari 可能优先调用本地版本导致乱码；临时停用测试
- 确保
font-family声明与@font-face中的family完全一致，包括引号和空格，例如"Font Awesome 5 Free"不可简写为FontAwesome
清空双层缓存再验证
静态缓存 + ThinkPHP 模板编译缓存 + OPcache 可能叠加影响，必须彻底清理：
- 删除
runtime/request_cache/全部文件（静态缓存存储目录） - 删除
runtime/Cache/和runtime/Temp/（模板编译与哈希映射） - 若开启 OPcache，访问一次
opcache_reset()脚本，或重启 PHP-FPM - 浏览器强制硬刷新（Cmd+Shift+R / Ctrl+F5），并清空“已缓存的图像和文件”
php免费学习视频：立即使用
踏上前端学习之旅，开启通往精通之路！从前端基础到项目实战，循序渐进，一步一个脚印，迈向巅峰！
