favicon 未更新？先解决缓存
无法更新的 favicon 几乎总是缓存问题，而不是 bug。先确认文件确实变了，再从文件往外逐层破除缓存。
动浏览器之前先检查文件
favicon 在每一层都被激进地缓存：浏览器、你的 CDN，有时还有过期的构建产物。在怪罪浏览器之前，先弄清楚是哪一层在提供旧图。
直接看文件。在地址栏打开 https://yoursite.com/favicon.ico，看看加载出来的是什么。如果是旧图标，问题就不在浏览器，而是服务器或 CDN 还在提供之前的文件。如果是新图标，说明文件已正常发布，只是你的浏览器缓存落后了。
从文件往外逐层处理
- 1
直接打开图标 URL
在地址栏加载 /favicon.ico 以及每个 PNG 路径。URL 上是旧图意味着服务器、构建或 CDN 缓存问题。URL 上是新图意味着只有你的浏览器过期了，直接跳到浏览器相关步骤。
- 2
给标签加上版本查询参数
查询字符串会让 URL 看起来是新的，于是缓存会去取一份新副本。每次图标改变时就把数字加一。这是最可靠的浏览器缓存修复手段。
- 3
在隐私窗口里做硬刷新
隐私或无痕窗口会忽略你平时的 favicon 缓存。把它和硬刷新结合起来，确保你测试的是已部署的文件，而不是本地副本。
- 4
清除 CDN，清掉过期构建
如果 URL 上还是旧图，就在你的 CDN 或边缘缓存里清除图标路径，然后确认你的构建确实复制了新文件。缓存的构建产物会一直提供旧图标，直到你清掉它并重新构建。
版本查询参数
<link rel="icon" href="/favicon.ico?v=2" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=2">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png?v=2">每次图标改变时就把 ?v= 加一。文件路径相同，URL 却是新的，所以浏览器和 CDN 缓存会把它当作全新资源。
常见问题
为什么我改了 favicon 后它还是没更新？
有一层缓存在提供旧文件。直接打开 /favicon.ico：那里是旧图指向 CDN 或构建缓存，那里是新图指向你的浏览器缓存。修复真正过期的那一层。
怎么强制浏览器重新加载 favicon？
在 link 标签上加一个像 /favicon.ico?v=2 的版本查询字符串，每次改动都把它加一，然后在隐私窗口里硬刷新。这是让浏览器去取新副本最可靠的方式。
favicon 要多久才会自己更新？
这取决于你的缓存有效期。没有版本查询参数时可能要几个小时甚至更久，因为浏览器和 CDN 会长时间保留图标。加上版本查询参数，改动会在下次加载时生效。
我的 favicon 到处都更新了，就 iOS 主屏幕没更新。为什么？
已保存的 iOS 快捷方式会把图标冻结在添加时的那一刻。删除快捷方式，再重新把页面添加回去，才能拿到新的 apple-touch-icon。