“网站不可用”，因为离线时缓存清空？答案

【问题标题】："Unavailable website", because the cache emptied when offline?“网站不可用”，因为离线时缓存清空？
【发布时间】：2021-03-18 21:14:59
【问题描述】：

我一定漏掉了一些明显的东西。我为离线模式制作了一个 pwa。我使用 Service Worker 缓存文件。我在缓存存储中看到它们。

但是当我离线并按 F5 时，网站似乎不可用。我看到缓存存储是空的。当我再次上线时，存储就在这里。

亲爱的开发者发生了什么事？

【问题讨论】：

【解决方案1】：

DevTools 只会让您检查与当前打开的网页的来源相关联的缓存。

如果您处于离线状态并且未通过 Service Worker 显示后备页面，那么您将看到标准的“无互联网”页面 - 在 Chrome 上，这是“离线恐龙”游戏。

此页面的 URL 设置为chrome-error://chromewebdata/，来源设置为null：

由于源与实际 Web 应用程序的源不匹配，因此 DevTools 的缓存查看器中没有显示任何内容。

【讨论】：

谢谢你回答我。当我添加一个后备页面时，它会卡在上面。当我试图到达我的第二页时，它会系统地回到第一页。但你是对的，当我将此后备添加到 index.php 时，我仍然看到缓存存储。那么为什么我无法访问另一个页面，因为我看到缓存存储中的所有文件？我只希望可以从缓存中离线访问这些页面。也许我的 MVC/php 架构不适合 PWA 系统？