你有没有遇到过这种情况：明明网站已经发布了新版本，但在Chrome里打开，看到的却还是老样子？服务器端的内容明明更新了，浏览器却像“卡”在了某个旧时间点。

这背后，十有八九是Service Worker在“作祟”。作为浏览器中一种强大的后台脚本，Service Worker能拦截网络请求、管理离线缓存，极大地提升体验。

但这也带来了一个副作用：一旦它缓存了旧版本资源，就会固执地优先提供这些内容，导致你无法看到最新的页面。

今天，我们就来聊聊，当遇到这种“加载旧资源”的尴尬时，如何通过几种手动方式，精准地“重置”缓存状态，确保你能获取到最新内容。

一、通过开发者工具，精准清除单站点缓存

这是最直接、最常用的方法。它针对你当前打开的特定网站，先终止其Service Worker进程，再清理关联的缓存，相当于给这个站点做了一次“定点清除”。

操作步骤如下：

1. 在Chrome中打开那个出现问题的网页。
2. 按下 F12（Windows/Linux）或 Cmd+Option+I（macOS），召唤出开发者工具。
3. 将标签页切换到 Application（应用程序）。
4. 在左侧边栏，找到并点击 Service Workers。这时，右侧会列出当前页面注册的所有Service Worker。
5. 找到目标站点对应的那一条，果断点击下方的 Unregister 按钮，让它“下岗”。

光注销还不够，缓存仓库里可能还留着旧货。

• 在左侧边栏再展开 Cache Storage。
• 找到属于该站点的缓存条目（通常包含域名或版本号），逐个右键点击，选择 Delete 将其移除。

完成以上操作后，刷新页面。浏览器就会尝试重新从服务器拉取资源，并注册新的Service Worker（如果网站配置了的话）。

二、使用内置页面，全局管理所有Service Worker

有时候问题可能更复杂，比如同一个域名下的不同路径注册了多个Service Worker。这时，我们可以祭出Chrome的一个内置管理页面：chrome://serviceworker-internals/。

操作步骤如下：

1. 在地址栏直接输入上述地址并回车，你会看到一个全局列表，展示了浏览器中所有已注册的Service Worker及其详细信息，包括状态、来源等。
2. 在这个列表里找到你的目标网站（例如 https://example.com），确认其状态。
3. 点击对应条目右侧的 Unregister 按钮。如果存在多个同源但不同路径的注册项，记得逐一处理。

关闭这个管理页面，再回去访问原网站，通常就能看到新内容了。这个方法特别适合清理那些“隐藏”在不同子路径下的陈旧Service Worker。

三、清除整站数据，彻底“重置”网站状态

如果页面已经因为缓存问题完全无法正常加载或出现了重定向异常，上述方法可能无法执行。这时，我们可以考虑更彻底的方案：清除该站点的所有本地数据。

操作步骤如下：

1. 在地址栏输入 chrome://settings/siteData 并访问。你会进入一个站点数据管理界面。
2. 在顶部的搜索框里，输入目标网站的域名（例如 example.com，不需要加https://）。
3. 在搜索结果中找到对应的站点，点击右侧的“三个点”菜单图标，选择 Remove。

确认之后，Chrome会删除该域名下所有的本地存储，包括Service Worker脚本、Cache Storage、IndexedDB、LocalStorage等。这相当于让网站在你的浏览器里“恢复出厂设置”。之后再次访问，一切都会从头开始加载。

四、一键清空：开发者工具中的“Clear storage”功能

如果你想在一个界面里完成多项清理工作，避免遗漏，那么开发者工具里的“Clear storage”功能是你的好帮手。它集成了清除缓存、Service Worker、Cookies等多种选项。

操作步骤如下：

1. 打开目标网页和开发者工具（F12），切换到 Application 标签页。
2. 在左侧边栏，找到并展开 Clear storage 部分。确保右侧显示的Origin（来源）是你的目标网站。
3. 勾选上 Cache Storage 和 Service Workers 这两个关键选项。
4. 点击那个醒目的 Clear site data 按钮。

等待操作完成，然后关闭开发者工具，按下 Ctrl + R（或 Command + R）强制刷新页面，看看问题是否已经解决。

五、调试利器：禁用缓存，直连服务器

最后这个方法，更多用于辅助判断和调试。它并不能永久解决问题，但能帮你快速验证：资源不更新，到底是不是Service Worker缓存导致的？

操作步骤如下：

1. 打开开发者工具（F12），这次切换到 Network（网络）标签页。
2. 注意顶部工具栏，找到一个复选框，写着 Disable cache (while DevTools is open)，勾选它。

这个选项的作用是，只要开发者工具开着，浏览器就会忽略所有缓存（包括Service Worker的拦截），所有请求都直接发给服务器。

勾选后，刷新页面。然后观察Network面板里的请求列表：

• 如果所有资源都返回了200状态码。
• 并且没有显示“from ServiceWorker”的字样。
• 同时页面内容更新了。

那就铁证如山——之前的问题就是Service Worker缓存造成的。确认之后，你就可以安心地使用前四种方法之一去永久解决它了。

以上就是解决Chrome中Service Worker导致加载旧资源的几种核心方法。根据问题的顽固程度和你的具体场景，选择最适合的那把“钥匙”即可。

记住，在Web开发中，缓存是朋友，但过时的缓存，可能就是那个需要被及时清理的“老朋友”了。

《夸克》非常好用的免费AI浏览器

下载APP查看