WordPress网站在Catalina系统Safari 13.0以下版本无法显示图片求助

问题背景 #

站点在Ventura、Monterey、Big Sur系统的Safari中运行正常，但切换图片格式从WebP到JPEG/PNG后，Catalina系统上Safari 13.0及以下版本出现图片无法加载的问题。已尝试SSL内容修复插件、清除网站/Cloudflare缓存、修正HTTP/HTTPS混合内容、降级WordPress及插件等操作，问题未解决。

针对性排查与修复步骤 #

• 检查图片响应头兼容性
  打开Safari Web Inspector查看图片请求的响应头：

  • 确认Content-Type严格匹配图片格式（JPEG对应image/jpeg，PNG对应image/png），避免返回application/octet-stream这类通用类型。
  • 排查是否残留WebP时期的Content-Encoding配置（如gzip/br），旧版Safari无法解析错误编码的图片。

• 验证图片文件编码兼容性

  • 用Preview或GIMP重新导出图片：JPEG选择基线编码（禁用渐进式），PNG选择PNG-8/PNG-24格式，避免使用旧版Safari不支持的编码特性。
  • 移除图片EXIF元数据后测试，部分特殊元字段会导致旧版Safari解析异常。

• 排查服务器/CDN图片优化配置

  • 临时关闭Cloudflare的Polish、Auto Minify功能，这类自动优化可能生成旧版Safari不兼容的图片格式。
  • 升级服务器的GD/Imagick库到稳定版本，确保图片处理逻辑兼容旧版浏览器。

• 检查图片标签属性

  • 移除<img>标签的loading="lazy"属性（Safari 15.4才支持懒加载），旧版浏览器会拦截带该属性的图片。
  • 临时移除srcset/sizes配置，仅保留src属性测试，避免属性配置错误导致资源匹配失败。

• 排查内容安全策略（CSP）

  • 检查Content-Security-Policy响应头的img-src指令，确保包含站点域名或self，避免策略拦截图片加载。
  • 临时移除CSP配置测试，确认是否为策略限制导致的问题。

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