workbox - Workbox registerRoute问题与兑现

Question

这是我使用 workbox-webpack-plugin (InjectManifest) 编译的 service-worker：

importScripts("/dist/precache-manifest.fec4937a7fe6a37db29b13fc00b6d92a.js", "/dist/workbox-v3.2.0/workbox-sw.js");
workbox.setConfig({modulePathPrefix: "/dist/workbox-v3.2.0"});
importScripts('/idb.js');
importScripts('/utility.js');

var STATIC_FILES = [
    '/index.html',
    '/idb.js',
    '/utility.js',
];

workbox.routing.registerRoute(
    'http://54.xx.xxx.57/(.*)',
    workbox.strategies.networkFirst({
        cacheName: 'cache-posts'
    }),
    'GET'
);

self.__precacheManifest = STATIC_FILES.concat(self.__precacheManifest || []);
workbox.precaching.suppressWarnings();
workbox.precaching.precacheAndRoute(self.__precacheManifest, {});

预缓存没问题，但我不知道如何让 registerRoute 工作，我尝试了几件事。SW 只是不兑现来自“ http://54.xx.xxx.57/ ”的任何东西。请帮忙... ：）

Answer 1

看起来它不是 registerRoute 中的正则表达式。应该：

workbox.routing.registerRoute(
  new RegExp('http://54.xx.xxx.57/(.*)'),
  workbox.strategies.networkFirst({
    cacheName: 'cache-posts'
  }),
 'GET');

Answer 2

您的正则表达式中有错误。你应该像这样逃避正斜杠。

 '/http:\/\/54.xx.xxx.57\/(.*)/'

理想情况下，如果您不想像这样捕获任何字符而不是它们，那么这些点也应该被转义：

'/http:\/\/54\.xx\.xxx\.57\/(.*)/'