Workbox 离线模式仅适用于根路径

Question

我正在处理我的 PWA 应用程序。所以我有一个问题，我找不到任何如何解决的信息。

我将工作箱与 webpack InjectManifest 一起使用（但也尝试过 webpack offline-plugin ）。

当我从根访问我的网页并离线时，我可以看到它运行良好。但是当我将路由更改为“/授权”或基本上任何其他路由并离线时，它不起作用。

是否有任何要求它仅在我们位于根路径上的情况下才有效？除了这个，我找不到任何关于它的东西：https : //github.com/quasarframework/quasar-cli/issues/131

Answer 1

好的找到了。所以基本上这一切都涉及到路由。

https://developers.google.com/web/tools/workbox/modules/workbox-routing#how_to_register_a_navigation_route https://developers.google.com/web/tools/workbox/modules/workbox-strategies

就我而言，我希望始终像 SPA 一样提供内容，因此我必须添加 workbox.routing.registerNavigationRoute('/index.html');到我的工作箱配置中。

最后看起来像这样：

1）Webpack插件：

const commonPlugins = [
  new workboxPlugin.InjectManifest({
    swSrc: './src/workbox-sw.js',
    swDest: 'workbox-sw.js',
  }),
];

2）workbox-sw的内容

/* globals workbox, self */

workbox.setConfig({
  debug: true
});

workbox.core.setCacheNameDetails({
  prefix: 'sneak-client',
  suffix: 'v1',
  precache: 'sneak-precache',
  runtime: 'sneak-runtime-cache',
});

workbox.routing.registerNavigationRoute('/index.html');

workbox.precaching.precacheAndRoute(self.__precacheManifest);