Javascript 有没有办法在PWA中缓存多个文件？

当用户在其设备上“安装”PWA时，是否有办法下载资产文件夹？我有大约300MB的图像（地图分幅），我需要为用户预缓存，我的用户将在一个没有连接的区域。我想知道这个“安装”是否创建了一些本地文件夹，我可以将我的图像下载到其中，或者不幸的是，我需要使用本机

---

我已经尝试了一些与我的地图解决方案配合使用的lib（

传单

），但这些lib只以blob格式将png缓存在

索引数据库中，我不认为这是一个很好的解决方案来处理如此庞大的数据。
您可以使用
pre-fecth
策略，以确保在安装service worker时所有静态资产都已下载并可在缓存中使用：

const mapTilesToCache = [
  '/mapFolder/',
];

const staticCacheName = 'tiles-cache';

self.addEventListener('install', event => {
  event.waitUntil(
    caches.open(staticCacheName)
    .then(cache => {
      return cache.addAll(mapTilesToCache);
    })
  );
});

但是请记住，这种策略通常用于appshell文件（远小于300MB）。如果服务工作者无法下载您为“安装”阶段定义的资源，它将中止安装

文件进入缓存后，您可以将其提供给用户：

self.addEventListener('fetch', event => {
  event.respondWith(
    caches.match(event.request)
    .then(response => {
      if (response) {
        // return the file from the cache
        return response;
      }

    }).catch(error => {
      // Respond with custom offline page
    })
  );
});

我明白了，这就是我现在所做的，但我只允许缓存50MB左右，因为配额…所以我认为我需要去本地。。。