Javascript ServiceWorker-脱机时缓存所有失败的post请求，联机时重新提交

我的服务人员目前成功地实现了以下目标：

• 它缓存联机时访问的所有页面
• 它仅在脱机时返回缓存页面

我的应用程序能够让用户输入签名，签名通过ajax自动提交。我试图在我的服务人员脱机时捕获此post请求，并在他们联机后立即重新提交相同的请求

下面是我的serviceworker文件的示例

self.addEventListener('fetch', function(event) {
    // Intercept all fetch requests from the parent page
    event.respondWith(
        caches.match(event.request)
        .then(function(response) {
            // Immediately respond if request exists in the cache and user is offline
            if (response && !navigator.onLine) {
                return response;
            }


            // IMPORTANT: Clone the request. A request is a stream and
            // can only be consumed once. Since we are consuming this
            // once by cache and once by the browser for fetch, we need
            // to clone the response
            var fetchRequest = event.request.clone();

            // Make the external resource request
            return fetch(fetchRequest).then(
                function(response) {
                // If we do not have a valid response, immediately return the error response
                // so that we do not put the bad response into cache
                if (!response || response.status !== 200 || response.type !== 'basic') {
                    return response;
                }

                // IMPORTANT: Clone the response. A response is a stream
                // and because we want the browser to consume the response
                // as well as the cache consuming the response, we need
                // to clone it so we have 2 stream.
                var responseToCache = response.clone();

                // Place the request response within the cache
                caches.open(CACHE_NAME)
                .then(function(cache) {
                    if(event.request.method !== "POST")
                    {
                        cache.put(event.request, responseToCache);
                    }
                });

                return response;
            }
            );
        })
    );
});

---

我想找出最好的方法来合并这个？有人能透露一些信息吗

在下面的注释下面，我用下面的代码实现了我想要的结果

// Cache signature post request
    //This retrieves all the information about the POST request including the formdata body, where the URL contains updateSignature.
// Resubmit offline signature requests
    //This resubmits all cached POST results and then empties the array.

self.addEventListener('fetch', function(event) {
    // Intercept all fetch requests from the parent page
    event.respondWith(
        caches.match(event.request)
        .then(function(response) {
            // Cache signature post request
            if (event.request.url.includes('updateSignature') && !navigator.onLine) {
                var request = event.request;
                var headers = {};
                for (var entry of request.headers.entries()) {
                    headers[entry[0]] = entry[1];
                }
                var serialized = {
                    url: request.url,
                    headers: headers,
                    method: request.method,
                    mode: request.mode,
                    credentials: request.credentials,
                    cache: request.cache,
                    redirect: request.redirect,
                    referrer: request.referrer
                };
                request.clone().text().then(function(body) {
                    serialized.body = body;
                    callsToCache.push(serialized);
                    console.log(callsToCache);
                });     
            }
            // Immediately respond if request exists in the cache and user is offline
            if (response && !navigator.onLine) {
                return response;
            }
            // Resubmit offline signature requests
            if(navigator.onLine && callsToCache.length > 0) {
                callsToCache.forEach(function(signatureRequest) {
                    fetch(signatureRequest.url, {
                        method: signatureRequest.method,
                        body: signatureRequest.body
                    })
                });
                callsToCache = [];
            }


            // IMPORTANT: Clone the request. A request is a stream and
            // can only be consumed once. Since we are consuming this
            // once by cache and once by the browser for fetch, we need
            // to clone the response
            var fetchRequest = event.request.clone();

            // Make the external resource request
            return fetch(fetchRequest).then(
                function(response) {
                // If we do not have a valid response, immediately return the error response
                // so that we do not put the bad response into cache
                if (!response || response.status !== 200 || response.type !== 'basic') {
                    return response;
                }

                // IMPORTANT: Clone the response. A response is a stream
                // and because we want the browser to consume the response
                // as well as the cache consuming the response, we need
                // to clone it so we have 2 stream.
                var responseToCache = response.clone();

                // Place the request response within the cache
                caches.open(CACHE_NAME)
                .then(function(cache) {
                    if(event.request.method !== "POST")
                    {
                        cache.put(event.request, responseToCache);
                    }
                });

                return response;
            }
            );
        })
    );
});

---

@guest271314我已经更新了我的帖子，因为我找到了一种检索帖子表单数据的方法。@guest271314仍在研究重新提交这些请求的方法，但我很有可能从这一点上自己解决它。@guest271314已按预期完成所有工作。更新帖子，感谢您的帮助。考虑回复问题到原创，并回答自己的问题与更新的答案？见@guest271314谢谢我这么做了，两天内我无法接受我自己的答案。