Workbox运行时API路由仅在页面重新加载后有效

Question

我知道这是一个常见问题，但是我的问题有点不同。

我注册了自定义API路由。当用户单击“登录”按钮时，将触发此路由。问题在于该路线仅在第二次访问后才起作用。因此，您需要重新加载页面以查看此API调用已得到处理。这不是页面加载期间的自动请求-在注册服务工作者后，即在用户尝试登录后不久，将调用该请求。尽管如此，您仍然需要第二次访问该页面（或重新加载），以查看路由是否得到处理。

这是我的服务人员路线注册：

const API_REGEX = '(?:https:\\/\\/.*)?\\/api\\/';
const networkOnlyHandler = workbox.strategies.networkOnly();
const dashboardDataFetchHandler = ({ event }) => networkOnlyHandler.handle({ event }).catch(() => {
  return Response.error();
});


workbox.routing.registerRoute(
  new RegExp(API_REGEX),
  dashboardDataFetchHandler,
  'POST' // post method for login page
);

要明确-在第二次访问后，该路线按预期运行。我的应用程序是与webpack捆绑在一起的react-redux应用程序。我使用带有自定义服务工作者的InjectManifest函数的workbox-webpack-plugin> v3。

预先感谢您的回答。