首页 > 解决方案 > Javascript 从 xmlhttprequest 中删除 blob

问题描述

我有一个网络应用程序,它通过请求 blob 和创建 blob url 来预加载视频。

// Get video Blob URL
const url = 'https://www.some-video-url.com/video.mp4';
const xhr = new XMLHttpRequest();
xhr.open('GET', sourceUrl, true);
xhr.responseType = 'blob';
xhr.onprogress = () => {console.log('downloading')};
const blobUrl;
xhr.onload = () => {
  blobUrl = URL.createObjectURL(req.response);
  console.log('done');
};
xhr.send();
...


// After using video
URL.revokeObjectURL(blobUrl);

我会多次发送此类请求。一开始它工作得很好,但是,当我发送太多这些请求时,我得到了这个错误。

VM1853:10 GET https://www.some-video-url.com/video.mp4 net::ERR_FAILED 200

我在 Chrome 上运行它,这是我的假设。

根据此文档,chrome 的 Blob 存储限制似乎是总磁盘空间的 10%。我通过发送 xhr 请求来获取 2 GB 文件来确认这一点,直到我遇到错误。当我发送 20 个 2GB 文件的请求时出现错误。看起来这些 blob 没有被垃圾收集,因为它没有被正确地取消引用。这个神秘的参考似乎与xhr有关。

在我的应用程序中,我想 1. 开始在后台下载视频 2. 客户端观看视频 3. 视频播放完成后,删除视频

有没有可靠的方法来执行第 3 步?我希望 Blob 在使用后被删除。

标签: javascriptvideoweb-applicationsgarbage-collectionxmlhttprequest

解决方案


推荐阅读