服务人员导致页面无响应

时间:2019-02-20 20:25:46

标签: javascript service-worker

我试图在用户访问我的索引页面后立即缓存多个页面以供脱机使用。正在缓存的页面是可以完成的表单,可以在本地保存,直到设备获得连接为止。

一个特定的客户端具有20多种形式,这导致我的索引页面变得无响应。具体来说,尝试单击链接或导航到其他页面似乎要等待表单的 some 完成缓存。最终,另一个页面被加载,服务工作者继续其工作(根据控制台输出)。但是,索引页面仍显示鼠标悬停突出显示等。

我试图了解为什么导航到其他页面不是即时的。服务工作者是否不独立于我的网站而存在?


Index.js:

$(document).ready(function () {
    // retrieve the form URLs to pass to the service worker
    var urls = [];
    $('.formTile').each(function {
        var url = $(this).attr('href');
        urls.push(url);
    });

    nav.serviceWorker.controller.postMessage(urls);
}

服务工作者JS:

self.addEventListener('message', function (event) {
    var urls = event.data;
    urls.forEach(function (url) {
        var pageRequest = new Request(url);

        var cacheSearch = function(request) {
            return caches.match(request).then(function (matching) {
                if (matching /* and some other checks */) {
                    // log output
                } else {
                   caches.open('offline-forms').then(function (cache) {
                       return fetch(request).then(function (response) {
                           return cache.put(request, response);
                       });
                    });
                }
                return true;
            }, function () {
                // log error
                return false;
            });
        });

        event.waitUntil(cacheSearch (pageRequest));
    }
}

0 个答案:

没有答案