了解客户端文件的对象 URL 以及如何释放内存

2024-05-12

我在用createObjectURL获取本地图像文件的引用 URL。当我完成文件/图像后,我打电话revokeObjectURL释放该内存。一切对我来说都很好,但我只是想确保我释放了我能释放的所有内存。

我检查后出现了我的担忧chrome://blob-internals页。致电后createObjectURL使用该图像,我注意到创建了两个条目。一张有网址的blob:blobinternal:///d17c4eef-28e7-42bd-bafa-78d5cb86e761

和另一个

blob:http://localhost/dbfe7b09-81b1-48a4-87cd-d579b96adaf8

不过,两者都引用相同的本地文件路径。致电后revokeObjectURL仅删除了第二个条目chrome://blob-internals。为什么会发生这种情况,如何删除其他条目以及这两种类型之间有什么区别?

另外,我还看到过人们在使用图像之前就撤销 URL 的例子。这有什么作用呢?

对这个主题的一些见解将不胜感激! :)

EDIT: 我创建了一个例子jsfiddle http://jsfiddle.net/ag92S/5/。所以先打开斑点内部 http://chrome://blob-internals/并删除任何现有的斑点。然后运行 ​​jsfiddle 示例,并在您的计算机上选择一个图像文件。然后刷新 blobinternals 以查看它添加的内容。然后在我的示例中单击“撤销 URL”。最后刷新 blobinternals 以查看剩余的 blob。


另一个参考文献(以blob:blobinternal)似乎由input type="file"元素。我修改了您的函数以重置输入的值,当我单击撤销 URL 按钮时,所有引用都会被清除:

killBut.onclick = function () {
    URL.revokeObjectURL(ourURL);
    fileBut.value = '';
};

在 Chrome Canary 中测试。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

了解客户端文件的对象 URL 以及如何释放内存 的相关文章

随机推荐