媒体库预览已经是新图，文章里却还是旧图。电脑上正常，手机上又不对。把缓存清了几遍，问题仍然反复出现。
这种故障要先确认页面实际请求的是哪张图片。WordPress 页面可能使用缩略图，浏览器可能从 srcset 选择另一种尺寸，图片优化服务还可能提供独立的 WebP 或 AVIF 版本。只替换原文件，未必更新了这些派生资源。
本文按“实际地址 → 源文件 → 派生图片 → 页面引用 → 缓存层 → 验收”的顺序排查。示例适用于普通 WordPress 站点；对象存储、图片 CDN、多站点和替换插件的行为需要结合实际配置判断。本文依据官方文档整理，未在你的生产环境执行操作。
一、先记录出问题的图片地址
在显示旧图的页面打开浏览器开发者工具，选中图片元素，检查 src、srcset 和所在的 picture 元素。如果选中的是实际图片元素，可在控制台查看：
$0.currentSrc
currentSrc 表示浏览器当前选择的图片地址，即使它与元素的 src 不同，也可能是正常的响应式图片选择。[1] WordPress 能根据附件信息生成 srcset，为不同尺寸提供候选资源。[2]
随后在 Network 面板找到对应请求，记录完整 URL、响应状态、内容类型、缓存来源，以及页面是在电脑还是手机上出现问题。
不同位置需要区别检查：
- 正文图片可能使用附件的某个中间尺寸。
- 特色图片可能由主题按固定尺寸调用。
- CSS 背景图要检查计算后的样式及其网络请求。
- 延迟加载插件可能先显示占位图，再从其他属性中载入正式图片。
示意地址如下：
原始上传：/uploads/2026/10/banner.jpg
中间尺寸：/uploads/2026/10/banner-768x512.jpg
优化版本：/uploads/2026/10/banner-768x512.jpg.webp
这些文件名只是示例。优化插件或图片服务可能使用完全不同的命名、域名或转换参数。直接打开原图正常，不能证明页面使用的缩略图也正常。
二、确认替换的是哪个附件、哪份文件
先在媒体库中确认目标附件、上传月份、文件 URL，以及文章或特色图片引用的附件。重新上传一张同名图片，可能建立了新附件或生成带后缀的文件名，原文章仍然指向旧资源。
有 SSH 和 WP-CLI 的站点，可以在确认 WordPress 安装目录后做只读查询：
# 1234 为示例附件 ID，执行前换成媒体库中的实际 ID
wp --path=/var/www/example media image-size
wp --path=/var/www/example post meta get 1234 _wp_attached_file
wp --path=/var/www/example post meta get 1234 _wp_attachment_metadata
第一条查看已注册的图片尺寸，后两条查看附件文件路径与元数据。元数据可能包含当前文件、中间尺寸及其他相关信息，具体结构取决于 WordPress 版本和处理结果。[3][4]
大型图片还可能存在经过缩放的文件与保留的原始文件。不要仅凭文件管理器里“同名原图已经修改”就认定附件实际使用的源文件也已改变。
使用替换插件时，要查看它是否保留原附件 ID、是否重建尺寸、是否更新路径，以及是否与图片优化和远程存储兼容。插件不同版本的行为会变化，本文不把任何插件的选项名称当作通用规则。
如果资源存放在对象存储，服务器本地上传目录不一定就是用户访问的源站。要确认本次替换是否同步到了实际存储位置，避免排查错副本。
三、缩略图仍是旧图时，先处理目标附件
WordPress 会为图片生成中间尺寸，并保存相关附件元数据。[3] 覆盖一个 JPEG 文件，不等于同时改写所有尺寸、优化格式和远程副本。
在重建之前，备份目标附件相关文件和数据库元数据。先确认媒体库引用的源文件确实是新图，并且 WordPress 可以读取它。否则重建可能只会从旧源文件再次生成旧缩略图。
具备 WP-CLI、正确站点路径及适当文件权限时，可以只针对一个附件处理：
# 会生成文件并更新相关附件元数据；先备份并核对 ID
wp --path=/var/www/example media regenerate 1234 --skip-delete
--skip-delete 用于保留旧缩略图文件，并不意味着同路径文件绝对不会被改写；仍然需要备份。[5] --only-missing 只处理缺失尺寸，如果问题是现有缩略图内容过期，不能把它当作强制更新所有旧图的参数。
如果只涉及一个已注册尺寸，可以评估加上 --image_size 限定范围。具体参数以本机 wp help media regenerate 为准。不要一开始就全站重建：大量图片处理会增加 CPU、磁盘和存储请求压力。
没有命令行时，可以使用当前站点已经配置、且确认兼容的缩略图工具；先处理一张图片验证，再考虑扩大范围。不要在生产环境临时堆叠多个处理同一附件的插件。
若站点采用远程媒体卸载或图片优化，需要继续使用对应服务的同步、重新优化或派生缓存刷新流程。WordPress 本地缩略图重建不能保证外部 WebP、AVIF 或远程转换结果同时更新。
四、页面引用旧地址时，清图片缓存解决不了
若图片文件都已更新，但 Network 仍请求旧 URL，应回到页面引用排查。
检查文章内容、特色图片、页面构建器设置和主题背景图，看是否还保存旧附件或旧地址。某些页面构建器会生成独立 CSS 文件，修改设置后还需要按其官方流程重新生成相关文件。
页面缓存也可能保留旧 HTML，其中的 srcset、背景地址或优化 URL 尚未更新。此时需要刷新受影响页面的缓存，而不只是刷新某个图片文件。
如果选择新文件名作为更新方案，应让文章正文、特色图片和背景图都改用新资源，再检查实际输出。仅在媒体库上传新文件，不会自动替换所有历史页面引用。
不要为修改一张图片直接执行全库文本替换。序列化数据、页面构建器结构和多个站点共用字段都可能受到影响。确实需要批量处理时，要先备份并采用了解 WordPress 数据格式的工具，核对匹配范围和回退方法。
五、区分浏览器缓存和 CDN 缓存
浏览器缓存与共享缓存是不同层次。Cache-Control、验证器和缓存响应会影响资源何时复用或重新验证。[6]
在开发者工具的 Network 面板中启用 Disable cache，再重新加载测试页面；通常需要保持开发者工具打开。无痕窗口或另一台设备可作补充验证，但它们仍可能访问同一份 CDN 缓存。
判断时结合这些信息：
from memory cache或from disk cache提示浏览器复用了本地结果。304表示条件请求验证后的复用，不是这次重新下载了完整图片。Cache-Control和Age可提供缓存线索；具体 CDN 命中标记取决于服务商。
单靠一个响应头不能证明所有缓存层都已刷新。图片优化服务、反向代理和 CDN 可能各自维护缓存，源站代理也可能保留旧副本。
可以用下面的示例查看公开图片响应头：
# 替换为页面实际请求的完整公开图片 URL
curl -I 'https://images.example.com/uploads/2026/10/banner-768x512.jpg'
这只是 HEAD 请求，不下载图片内容，也不能代替浏览器实际 GET 请求的图片对照。签名 URL、私有图片和登录后资源不要公开分享；不同请求方式或响应格式协商还可能得到不同结果。
六、CDN 刷新应针对页面实际使用的资源
确认源站或图片服务已经返回新图后，再按 CDN 文档刷新准确的资源。否则边缘节点清理后可能又回源取得旧版本。
优先处理实际请求的完整图片 URL。如果页面引用、响应式候选或优化地址也变了，再刷新受影响页面 HTML 或相关生成文件，避免无必要地清空全站缓存。
以 Cloudflare 的单文件刷新文档为例，查询参数以及自定义缓存键中的请求头等信息，可能影响要提交的刷新条件。[7] 使用其他 CDN 时，需要查对应服务的缓存键与 URL 刷新规则，不能简单照搬。
给地址加 ?v=2 可能创建一个新的缓存地址，但前提是缓存策略把查询参数计入缓存键，而且页面输出确实使用新地址。如果 CDN 忽略参数或进行了归一化，这种方法可能无效。它也不会修复原地址指向旧文件或缩略图未更新的问题。
对于采用长时间缓存的静态图片，新文件名通常便于管理版本，但需要同步更新引用并考虑历史页面。频繁覆盖同一个长期缓存 URL，会增加跨浏览器和边缘节点保持一致的难度。[6]
七、用电脑和手机分别验收
完成处理后，至少验证文章正文、特色图片或列表缩略图，以及原来出现问题的手机页面。不同屏幕和像素密度可能选中不同的 srcset 候选，因此一个端点正常还不够。
验收时记录实际请求地址和看到的图片内容，并确认：源文件是新图、目标尺寸或格式是新图、页面输出引用正确、重新开启正常缓存后仍能看到预期版本。
还要检查图片尺寸、裁剪、清晰度和加载结果，避免重建时引入版式变化或缺失资源。若处理后出错，按备份恢复这次修改的文件、元数据和页面引用，再刷新受影响资源，而不是继续扩大清理范围。
媒体库预览、页面引用、图片派生资源和访问端缓存分别对应不同的状态。找到浏览器实际请求的地址之后，才知道该更新哪份文件、重建哪个尺寸，以及刷新哪一层缓存。
参考资料
资料核验日期：2026 年 10 月 12 日。工具参数及插件行为应以本机版本和当前官方文档为准。
- MDN：HTMLImageElement.currentSrc。https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/currentSrc
- WordPress 开发者文档：wp_get_attachment_image_srcset。https://developer.wordpress.org/reference/functions/wp_get_attachment_image_srcset/
- WordPress 开发者文档：wp_generate_attachment_metadata。https://developer.wordpress.org/reference/functions/wp_generate_attachment_metadata/
- WP-CLI：wp media image-size。https://developer.wordpress.org/cli/commands/media/image-size/
- WP-CLI：wp media regenerate。https://developer.wordpress.org/cli/commands/media/regenerate/
- MDN：HTTP caching。https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/Caching
- Cloudflare：Purge cache by single-file URL。https://developers.cloudflare.com/cache/how-to/purge-cache/purge-by-single-file/