如何从对象URL获取文件或blob？
如何从对象URL获取文件或blob？
提问于 2012-08-09 11:00:13
我允许用户通过拖放和其他方法将图像加载到页面中。当图像被删除时，我使用URL.createObjectURL将其转换为object URL以显示图像。我没有撤销这个url，因为我确实重用了它。
因此，当需要创建一个FormData对象以便我可以允许他们上传包含其中一个图像的表单时，有没有什么方法可以将该对象的URL还原为Blob或File，以便将其附加到FormData对象中？
回答 7
Stack Overflow用户
回答已采纳
发布于 2018-09-20 00:04:41
现代解决方案：
let blob = await fetch(url).then(r => r.blob());url可以是对象url或普通url。
Stack Overflow用户
发布于 2012-08-10 20:25:52
正如gengkev在上面的评论中暗示的那样，看起来最好的/唯一的方法是使用异步xhr2调用：
var xhr = new XMLHttpRequest();
xhr.open('GET', 'blob:http%3A//your.blob.url.here', true);
xhr.responseType = 'blob';
xhr.onload = function(e) {
if (this.status == 200) {
var myBlob = this.response;
// myBlob is now the blob that the object URL pointed to.
}
};
xhr.send();更新(2018)：对于可以安全使用ES5的情况，乔有一个更简单的基于ES5的答案。
Stack Overflow用户
发布于 2018-02-06 19:44:10
也许有人会在使用React/Node/Axios时发现这一点很有用。我将其用于我的Cloudinary图像上传功能，并在UI上使用react-dropzone。
axios({
method: 'get',
url: file[0].preview, // blob url eg. blob:http://127.0.0.1:8000/e89c5d87-a634-4540-974c-30dc476825cc
responseType: 'blob'
}).then(function(response){
var reader = new FileReader();
reader.readAsDataURL(response.data);
reader.onloadend = function() {
var base64data = reader.result;
self.props.onMainImageDrop(base64data)
}
})页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11876175
复制相关文章
相似问题