需要刷新以前访问过的 Gatsby 站点以查看更改

Question

我在 Netlify 上托管了一个 Gatsby 站点。当我部署一个新版本时，我对站点所做的更改在我刷新页面之前是不可见的。有谁知道为什么会这样？

我正在使用gatsby-plugin-offline& gatsby-plugin-manifest。我看到我可以安装gatsby-plugin-remove-serviceworker插件来删除服务工作者，但如果可能的话，我想继续使用它。

这是一个很难搜索的问题，因为我得到了有关.cache本地目录中文件夹的结果

Answer 1

问题：您的 Service Worker 仍然显示旧页面

在 Gatsby 中，服务工作者被编程为在导航时更新。通过使用gatsby-plugin-offline插件，服务工作者会自动包含到您的站点中。

问题在于，当用户回家并且不再导航时，将看不到任何更新。如果您希望页面在第一次访问时自动刷新并使旧缓存无效，则需要触发它。

解决方案：

您可以使用官方Gatsby 浏览器 API来触发对 Service Worker 的更新。

如果您有gatsby-plugin-offline，请gatsby-config.js将此行添加到您的gatsby-browser.js.

// trigger an immediate page refresh when an update is found
export const onServiceWorkerUpdateReady = () => window.location.reload();

这里有一些来自官方 github 存储库的关于这个问题的背景信息。