当 img 下载正在进行时，Performance api 不会在下载时更新传输大小，仅在完成时更新

Question

我正在使用性能 API 来监控图像的下载情况。这是为了实时 jpg 图像流并检测下载何时停止。所以我想监控下载的大小是否仍在增加。但是，资源事件只有在完全下载后才会触发。我这样使用：

        var currentObserver = null;
        function setupObserver(observeUrl) {
            currentObserver = null;
            currentObserver = new PerformanceObserver((list, obj) => {
              list.getEntries().forEach((entry) => {
                if(entry.name.indexOf(observeUrl) > 0) {
                    console.log("entry transferSize:", observeUrl, entry.transferSize);
                }
              });
            });
            currentObserver.observe({ entryTypes: ["resource"] });
        }

有没有办法在下载图像时获得更多更新，或者我也应该观察其他一些entryType？

非常感谢您的任何想法！

Answer 1

性能 api 似乎不是为了这个目的，使用 fetch api，现在可以在后台获取图像，然后将其分配给 和 的 src 。所以这个答案正是我真正需要的：

获取API下载进度指示器？