javascript - 如何在服务工作者中缓存之前修改响应正文？

Question

我认为这会相当简单，但我很难成功发送响应，然后修改我的克隆响应，该响应存储在我的服务工作者内部的缓存中。

最终，我想将我的缓存数据附加到获取的时间和日期。我正在使用我的服务人员首先从网络中获取这些数据，如果它不可用，则回退到缓存中。

这是我的服务人员的代码

        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);
            })
        );

标签： javascriptresponsehttpresponseservice-workerservice-worker-events