1

我开发了一个带有静态内容的渐进式网络应用程序。它在处理静态内容时运行良好，但每当我们尝试从 MS SQL 数据库动态获取数据时，它就无法按预期工作。如何从 MS SQL 数据库中获取动态数据并将其显示到缓存页面或如何使用仅限网络的功能？我是否需要对service-worker.js文件进行任何更改才能检索动态数据？

服务工作者.js：

var version = "1.0::";

var offlineResources = [
"/",
"style.css",
"image/logo.png",
"image/logo.jpg"
];

self.addEventListener("install", function(event) {
event.waitUntil(
    caches
        .open(version + "static")
        .then(function(cache) {
            cache.addAll(offlineResources);
        })
);
});

self.addEventListener("activate", function(event) {
event.waitUntil(
    caches.keys().then(function(keys) {
        return Promise.all(keys
            .filter(function (key) {
                return key.indexOf(version) !== 0;
            })
            .map(function (key) {
                return caches.delete(key);
            })
        );
    })
);
});

function isOfflineOrigin(origin) {
return origin === location.origin || origin.indexOf("netlify") !== -1;
}

self.addEventListener("fetch", function(event) {
var request = event.request;
var url = new URL(request.url);

// Only worry about GET requests and certain domains
if (request.method !== "GET" || !isOfflineOrigin(url.origin)) {
    return;
}

// For HTML try the network first, fall back to the cache, and then
// finally the offline page
if (request.headers.get("Accept").indexOf("text/html") !== -1) {
    event.respondWith(
        fetch(request)
            .then(function(response) {
                var copy = response.clone();
                caches.open(version + "pages")
                    .then(function(cache) {
                        cache.put(request, copy);
                    });
                return response;
            })
            .catch(function() {
                return caches.match(request)
                    .then(function(response) {
                        return response || caches.match("/offline/");
                    });
            })
    );
    return;
}

// For non-HTML requests look in the cache first, and fall back to
// the network
event.respondWith(
    caches.match(request)
        .then(function(response) {
            return response || fetch(request);
        })
);
});
4

1 回答 1

-1

我可以弄清楚你只是在缓存静态资源。What about the dynamic content like the responses from a remote API or service? 您必须为所有动态需求实现运行时缓存。

sw-toolbox很方便，它可以灵活地实现处理远程或动态资源的运行时缓存的请求处理程序。

于 2016-06-07T19:49:28.500 回答