我有一个使用workbox 2.0.0的服务工作者,对于某些页面,我使用的是workboxSW.strategies.staleWhileRevalidate()缓存策略:
const customFilter = {
cachedResponseWillBeUsed: function (input) {
try {
console.log('cacheResponseWillBeUsed for : ' + input.request.url);
// modify the response body here
} catch (e) {
console.error(e);
}
return input.cachedResponse;
},
requestWillFetch: function (input) {
try {
console.log('requestWillFetch for ' + input.request.url);
} catch (e) {
console.error(e);
}
return input.request;
},
fetchDidFail: function (input) {
console.log('A fetch request for ' + input.request.url + ' failed.');
}
}
const cachingStrategy = workboxSW.strategies.staleWhileRevalidate({
plugins: [
customFilter
]
});
workboxSW.router.registerRoute(
new RegExp('\/(.*)/suffix/?$'),
cachingStrategy
);
这很顺利,我可以快速更新从缓存中获得的响应。但我想动态修改所有响应,包括第一次从网络获取它们时(我必须在其中插入一些javascript)。
从我的测试中,cachedResponseWillBeUsed只允许从缓存中进行后处理响应(根据方法名称),但我还没有找到一种方法来访问网络响应(尽管通常情况下仍然使用staleWhileRevalidate策略。)< / p>
有什么建议吗?
非常感谢
答案 0 :(得分:0)
您的更正是因为没有RequestWrapper
生命周期事件对应于成功返回的网络请求。 (如果您希望将其添加到fetchDidSucceed
或类似内容中,请随意打开feature request!)
您可以通过编写自己的自定义处理程序来解决此问题,该处理程序调用{{1}},然后在返回之前对响应执行某些操作,如下所示:
strategies.staleWhileRevalidate