如何使用Service Workers和Cache Api从基本URL脱机加载网站？

问题描述

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

这意味着，如果您以前访问过我的网站，则可以在没有互联网限制的情况下再次加载它。

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

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

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

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

解决方法

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

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