如何使用 Service Workers 和 Cache Api 从基本 url 离线加载网站？

Question

当您访问此网站https://bugs.stringmanolo.ga/index.html时，在浏览 main.js 文件时会调用 ff.js 文件中的方法来缓存大量资源。因此，下次您登陆网络时，文件将直接从您的浏览器缓存中获取，而无需发出任何请求。这意味着如果您之前访问过我的网站，您可以在没有互联网连接的情况下再次加载它。问题是，这仅在您直接在地址栏中为 index.html 文件计时时才有效。瘸。Thid url 无法离线加载。 https://bugs.stringmanolo.ga另一个工作正常。 https://bugs.stringmanolo.ga/index.html当请求基本 url 时，如何使 Web 缓存也加载 index.html？

Answer 1

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

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

        });

});