1

有没有办法只匹配 Workbox 中的非导航请求？例如，我有一个包含多个 AMP 页面的应用程序，我想在我的应用程序 shell 中注入这些页面，因此我拦截到这些页面的所有导航并使用 shell 进行响应，如下所示：

workboxSW.router.registerNavigationRoute('shell.html', {
  whitelist: [/./]
});

我还想拦截所有其他请求并使用缓存优先策略处理它们，如下所示：

workboxSW.router.registerRoute('/*',
  workboxSW.strategies.cacheFirst()
);

但这条路线与第一条路线重叠。我可以用以下代码替换这两条路线以获得我正在寻找的行为：

workboxSW.router.registerRoute('/*', args => {
  if (args.event.request.mode !== 'navigate') {
    return workboxSW.strategies.cacheFirst().handle(args);
  }
  return caches.match('/shell.html', {ignoreSearch: true});
});

但是 request.mode不受多个移动浏览器（甚至一些支持 Service Worker）的支持，并且在一些极端情况下它会失败。

是否有一种方便、最实用的方法来匹配非导航请求？

4

1 回答 1

2

首先，您在使用如此广泛的正则表达式遇到麻烦。

一个简单的步骤是首先为您知道可以先缓存而不是导航路由的请求添加一个路由（即扩展名为 js、css、png、jpg 的路径）。

然后在那之后 - 使用您对构建的了解来匹配其他请求（即所有页面的网络请求是否以 html 结尾，或者您是否有漂亮的 url 以斜杠结尾？）。

您实际上可能只想添加一个默认路由，这样如果没有匹配的路由，则回退到默认路由并让它为 shell 服务。

于 2017-08-29T18:21:06.893 回答