javascript - 在javascript中将Blob转换为文件列表

Question

我正在使用以下代码将 Canvas 图像转换为 blob。
为了将 blob 转换为文件/文件列表对象，我需要将该文件列表传递给文件处理程序。

我的代码:

var canvas1 = document.getElementById("preview");
var theImage = document.getElementById("blahProfile");
theImage.src = canvas1.toDataURL();
var blob = dataURItoBlob(theImage.src);

有什么方法可以将该 blob 转换为文件对象吗？

Answer 1

File 对象包含比 Blob 对象更多的信息，具有 lastModifiedDate 和 fileName 等属性。您的图像数据具有这些属性中的任何一个都没有意义，因为它不是文件。

我假设您的 FileList 处理程序使用 FileReader 来读取 File 对象。但是，FileReader 方法也可以处理 Blob 对象(因为 File 是 Blob 的子类)。因此，您可以:

• 将您的 FileReader 代码提取到一个单独的函数中，该函数接受一个 Blob 或 File(可能还有一个解析回调函数)amd在处理每个 FileList 项和处理图像数据的 Blob

时调用该函数

• 如果您的 FileList 处理程序仅按索引访问列表项(例如，myFileList[i])，那么您可以伪造一个 FileList 只需使用 Blob 数组即可。例如，此函数适用于真正的 FileList 或 Blob 数组:

  function processFileList(list) {
      var reader = new FileReader();
      reader.readAsText(list[0]);
      reader.addEventListener("loadend", function() {
          console.log(reader.result);
      });
  }