我认为这会相当简单,但我很难成功发送响应,然后修改我的克隆响应,该响应存储在我的服务工作者内部的缓存中。
最终,我想将我的缓存数据附加到获取的时间和日期。我正在使用我的服务人员首先从网络中获取这些数据,如果它不可用,则回退到缓存中。
这是我的服务人员的代码
event.respondWith(
fetch(event.request)
.then(function(e) {
console.log('response', e)
var responseToCache = e.clone();
responseToCache.json().then(function(data) {
var today = new Date();
var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
data.cached = { date: date, time: time }
return data
})
// var init = {
// status: response.status,
// statusText: response.statusText,
// headers: { 'X-Foo': 'My Custom Header' }
// };
// response.headers.forEach(function(v, k) {
// init.headers[k] = v;
// });
// var responseToCache = response.text().then(function(body) {
// var today = new Date();
// var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
// var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
// var bodyObj = JSON.parse(body)
// bodyObj.cached = { date: date, time: time }
// body = JSON.stringify(bodyObj)
// return new Response(body, init);
// });
caches.open(CACHE_NAME)
.then(function(cache) {
cache.put(requestURL, responseToCache);
});
return e
})
.catch(function() {
console.log('data offline')
return caches.match(requestURL);
})
);