如何从对象URL获取文件或blob？

问题描述

我允许用户通过拖放和其他方法将图像加载到页面中。当图片被删除时，我使用 URL.createObjectURL 转换为对象URL来显示图片。我不撤销网址，因为我重复使用它。

I am allowing the user to load images into a page via drag&drop and other methods. When an image is dropped, I'm using URL.createObjectURL to convert to an object URL to display the image. I am not revoking the url, as I do reuse it.

因此，当需要创建 FormData 对象，所以我可以允许他们上传带有其中一个图像的表单，是否有某种方式可以将该对象URL反转回 Blob 或 File ，然后我可以将它附加到 FormData 对象中？

So, when it comes time to create a FormData object so I can allow them to upload a form with one of those images in it, is there some way I can then reverse that Object URL back into a Blob or File so I can then append it to a FormData object?

推荐答案

正如gengkev在他上面的评论中暗示的那样，看起来最好的/唯一的方法是使用异步xhr2调用：

As gengkev alludes to in his comment above, it looks like the best/only way to do this is with an async xhr2 call:

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();

这篇关于如何从对象URL获取文件或blob？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！