如何使用Service Workers和Cache Api从基本URL脱机加载网站? [英] How to load website offline from base url using Service Workers and Cache Api?

问题描述

当您访问此网站时 https://bugs.stringmanolo.ga/index.html，在浏览main.js文件时正在从ff.js文件中调用方法来缓存大量资源.因此，下次您登陆网络时，文件将直接从浏览器缓存中获取，而无需发出任何请求.

When you visit this web site https://bugs.stringmanolo.ga/index.html, while navigating around the main.js file is calling a method from ff.js file to cache a good amount of the resources. So next time you land to the web the files are directly taken from your browser cache without make any request.

这意味着，如果您以前访问过我的网站，则可以再次加载它而不会受到互联网的限制.

This means if you visited my website before, you can load it again without internet conection.

问题是，这仅在您直接在地址栏中计时index.html文件时有效.me脚.

The problem is, this only works if you directly time the index.html file in the addressbar. Lame.

该网址无法离线加载. https://bugs.stringmanolo.ga

Thid url dosn't work loaded offline. https://bugs.stringmanolo.ga

这另一个很好用. https://bugs.stringmanolo.ga/index.html

当请求基本URL时，如何使Web缓存也加载index.html?

How can i make the web cache also loads the index.html when the base url is requested?

推荐答案

在您的缓存阵列列表中添加一个根条目.就是这样.

In your cache array list add a root entry. That's it.

var CACHELIST = [
    "/",
    // rest of resource list
];

self.addEventListener("install", function (event) {
    console.log("Installing the Service Worker!");
    caches.open(CACHENAME)
        .then(cache => {
            cache.addAll(CACHELIST);
        });
});

这篇关于如何使用Service Workers和Cache Api从基本URL脱机加载网站?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！