在联机模式下，服务工作者api回退将接管服务器端呈现的页面。例如，当我第一次加载/about页面时，在源代码中查找我呈现的主页（因为我在/选项中将navigateFallback定义为sw-precache）：
仅在脱机模式下运行时，我才需要这种行为。
这是我使用的选项：
{
cacheId: pkg.name,
dontCacheBustUrlsMatching: /./,
dynamicUrlToDependencies: {
'/': [ resolve(__dirname, '../server/views/index.ejs') ]
},
navigateFallback: '/',
staticFileGlobs: [
`${publicDir}/{bundle,vendor}.*.{js,css,gz}`,
`${publicDir}/manifest.json`
],
stripPrefix: publicDir,
runtimeCaching: [{
urlPattern: /api/,
handler: 'networkFirst'
}]
}
最佳答案
navigateFallback中sw-precache的预期用例是提供一个静态HTML文档，该文档可以立即使用高速缓存优先策略进行提供，而不必违反网络。这样可以确保您对网站上任何URL的请求几乎都能立即得到满足，而不必等待不确定的时间来等待网络的响应。前提是您具有可用于满足任何导航请求的通用HTML页面（称为App Shell），并且知道如何实现客户端逻辑来检查当前URL并动态插入适当的内容。如果您已有支持单页应用程序样式导航的代码，那么通常就足够了。
您可以read more about this architectural pattern，还有一个基于React的PWA的full example，它使用SSR进行初始导航（或用于不支持服务工作者的客户端），然后在SW升级到navigateFallback行为。工作已安装。
如果您不想使用此模型，而是希望始终针对每个页面的SSR版本使用网络，并且仅在网络请求失败时才使用缓存的页面，则navigateFallback选项不合适选择。您可以在网上找到一些examples离线后备广告。