FileReader与window.URL.createObjectURL

Question

我正在构建移动网站，并且我想使用Camera API拍照。图像应显示在网站上并上传到服务器。根据{{​​3}}，可以使用FileReader或window.URL.createObjectURL访问和显示网站上的图片。我introduction to the Camera API on MDN使用iPad（Safari和Chrome）和Android平板电脑（Chrome和Firefox）成功解决了这些问题。

FileReader和window.URL.createObjectURL之间有什么区别？我认为window.URL.createObjectURL更新但不是标准。性能有差异吗？

Answer 1

有区别。

1）时间

• createObjectURL同步执行（立即）
• FileReader.readAsDataURL异步执行（一段时间后）

2）内存使用

• createObjectURL返回带有哈希的url，并将对象存储在内存中，直到文档触发卸载事件（例如文档关闭）或执行revokeObjectURL
• FileReader.readAsDataURL返回包含许多字符的base64，并使用比blob url更多的内存，但在不使用时从内存中删除（通过垃圾收集器）

3）支持

来自IE 10和所有现代浏览器的
• createObjectURL
来自IE 10和所有现代浏览器的

• FileReader.readAsDataURL

  从我这里，最好使用blob url（通过createObjectURL），它更有效，更快，但是如果你使用很多对象网址，你需要 通过revokeObjectURL释放这些网址（释放内存）。 例如，您可以在Image onload处理程序中调用URL.revokeObjectURL，而Image对象将保留图像数据，而不会丢失它，Nahuel Greco（c）。