GIF 转 APNG

拖拽图片到此处或点击上传

拖拽图片到此处

文件过大(最大 20MB)

Safari 系 APNG:`img` 原生解码路径与 Chrome 有细微时差,WebView 还要叠加 App 网络策略与 ATS

`safari-friendly-apng` 聚焦 iOS、macOS Safari 与 WKWebView:Apple 对 APNG 支持较早,但仍会受 `Content-Type`、跨域缓存、省电模式与「减少动态效果」影响。企业 App 常配自定义缓存或 HTTPS 证书钉扎,错误配置会导致动图永远显示首帧。此类发布要在真机而非仅桌面 Safari 测,且区分系统浏览器与内嵌 WebView 两套网络栈。

Safari 变体步骤:验 `image/apng` 与 TLS,再测 WebView 与系统浏览器一致性,最后覆盖省电与减弱动效

  1. 用 `curl -I` 确认 CDN 返回正确 MIME 与未误启 `content-disposition: attachment`;检查是否经过会剥 body 的安全代理。
  2. 在 WKWebView 与 Safari 同时打开同一 URL,录屏对比循环;若仅 WebView 异常,查自定义 `NSURLProtocol` 或离线包是否只缓存了首片数据。
  3. 开启「减少动态效果」与低电量模式回归,确认产品可接受静止替代;把结果写进无障碍说明而不是事后争议。

Safari 变体问答:WebView、MIME、省电与减弱动效

macOS Safari 正常,iOS WKWebView 只显示首帧,最先查网络栈还是解码能力?
先确认 WebView 是否完整下载资源:用远程调试看 Network 体积与 MIME。若下载完整仍静图,查是否有人为 `shouldInterceptRequest` 替换响应;再排除旧 iOS 版本缺陷。不要轻易归咎「APNG 不支持」而未看日志。
用户开启「减少动态效果」后 APNG 冻结,营销认为是 bug,应改产品还是尊重系统?
应提供语义清晰的静止替代或低运动版本,并在设计评审标注为合规特性而非缺陷。可统计该开关渗透率决定是否单独运营素材,但不要强行用 JS 绕过系统无障碍策略。
Safari 与 Chrome 同一文件循环周期差几十毫秒,对节拍敏感的音乐梗图怎么验收?
以音频或节拍器为基准录屏对比,允许极小抖动但需定义上限;若差值来自帧延时分母舍入,应在导出端统一量化到 1/100 s 网格。跨浏览器完全一致不现实,应写清「以哪一端为准」。
企业 MDM 限制跨域图片,APNG 托管在第三方 S3 被拦,如何改架构?
将动图迁到与页面同站域名或通过边缘 Worker 反代以消除跨域附加策略;同时检查 CSP `img-src`。安全团队若坚持隔离,需提供签名 URL 与白名单主机列表而不是让业务反复手工改链。
TestFlight 包与 App Store 正式包对 WKWebView 缓存策略不同,APNG 偶现旧版本,如何统一?
为 APNG URL 强制版本 query 或文件名指纹,并在升级指南要求卸载重装测试;记录 TestFlight 与生产 CDN 是否指向同一桶。问题常是缓存键不一致而非解码差异。
More versions