service-worker - 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);