FileReader.readAsDataURL(file) | URL.createObjectURL(file) | |
---|---|---|
返回值 | 得到一段data:base64的字符串 | 得到当前文件的一个内存URL |
内存使用 | 返回值是转化后的超长base64字符串(长度与要解析的文件大小正相关)并会比blob url消耗更多内存,但是在不用的时候会自动从内存中清除(通过垃圾回收机制) | createObjectURL返回一段带hash的url,并且一直存储在内存中,直到document触发了unload事件(例如:document close)或者执行revokeObjectURL来释放。 |
内存清理 | 依照JS垃圾回收机制自动从内存中清理 | 存在于当前doucment内,清除方式只有unload()事件或revokeObjectURL()手动清除 |
执行机制 | 异步执行 | 同步执行 |
其他 | 当多个文件同时处理时,需要每一个文件对应一个新的FileReader对象 | 依次返回无影响 |
兼容性 | ie10以上的浏览器 | ie10以上的浏览器 |
使用方式:
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = ()=>{
console.log(reader.result);
}
const blobUrl = URL.createObjectURL(blob);