时间戳

首页 > 解决方案 > 使用服务人员的 Firefox 中可兑现文件的限制？

javascript - 使用服务人员的 Firefox 中可兑现文件的限制？

问题描述

我希望有人可以帮助我。

在我的服务工作者的安装阶段，我尝试缓存 100 个文件，但 Firefox 只缓存其中的 50 或 60 个，每次我安装服务工作者时都会缓存不同的文件。

在监控缓存时，我没有收到任何错误，但安装完成后，一半的文件不在缓存中。这适用于 MacOS Catalina 和 Windows 10 上的 Firefox 75。在 Safari、Edge、Chrome 中一切正常。

我正在缓存的测试文件每个 3kb 并且使用“存储”和“估计”我看到有足够的可用空间。

这是我的服务人员代码。我尝试使用 cache.addAll 和 forEach 来监控缓存，但结果是一样的：大约一半的文件丢失了。

    const CACHE_NAME = 'limit-test-cache-v1';
    const urlsToCache = [
        '/serviceworker-limit/testdata/testdata1.pdf',
        '/serviceworker-limit/testdata/testdata2.pdf',
        '/serviceworker-limit/testdata/testdata3.pdf',
        '/serviceworker-limit/testdata/testdata4.pdf',
    ...
        '/serviceworker-limit/testdata/testdata97.pdf',
        '/serviceworker-limit/testdata/testdata98.pdf',
        '/serviceworker-limit/testdata/testdata99.pdf',
        '/serviceworker-limit/testdata/testdata100.pdf'
    ];
    const cacheSize = urlsToCache.length;
    let counter = 0;

    self.addEventListener('install', event => {
        event.waitUntil(

            /*
            caches.open(CACHE_NAME).then(cache => {
                cache.addAll(urlsToCache);
            })
            */


            caches.open(CACHE_NAME).then(cache => {
                console.log('Opened cache');
                urlsToCache.forEach(url => {
                    const req = new Request(url);
                    cache.add(req).then(() => {
                        counter++;
                        console.log(url + ' has been cached. Message ' + counter + ' of total: ' + cacheSize);
                    }).catch(err => {
                        counter++;
                        console.log('Error while caching' + url + '. Error ' + err);
                    });
                });
            })


        );
    });

由于没有错误，我基本上不知道要搜索什么。这是某种预期的行为吗？我的代码错了吗？这是一个 Firefox 错误吗？扁平地球人到底是对的吗？如果有人可以给我一些指示，将不胜感激。

标签： javascriptfirefoxservice-worker

解决方案

如果有人感兴趣或遇到相同的问题，则此问题是由两个问题的组合引起的：

  1. 在服务人员状态从“激活”更改为“激活”后，我立即检查了缓存大小。如MDN所述（见第一个注释），这可能为时过早，因为已获取文件的内容主体可能仍在流式传输且缓存尚未准备好。我希望缓存大小会计算数据库条目，但显然情况并非如此。
  2. Firefox 开发工具中的缓存存储视图仅显示有限数量的缓存文件。像这样的注释：“这里只显示前 60 个缓存文件”有助于防止误解这种情况，但最终这里应该有某种分页。也许这个问题在 Firefox devEdition 的应用程序面板中得到了解决。

推荐阅读