Question

我正在尝试使用File API从blob对象创建图像文件，然后将其添加到要通过XHR发送的表单中。像Chrome中的魅力一样，但崩溃了Microsoft Edge中的应用程序。

let file = new File([blobContent], "image.png");

let form = new FormData();
form.append("file", file);

是否有文件API的替代方法或将文件附加到表单的变通方法？如果我只是将blob添加到表单中，则它不会被识别为图像。

谢谢！

Answer 1

目前IE11和Edge支持FileAPI，但不支持File构造函数。

在您发布到caniuse.com的链接中，有IE和Edge的注释表明不支持File构造函数。我遇到了同样的问题，我的工作是使用Blob而不是File，然后设置blob的类型。

var blob = new Blob([blobContent], {type : 'image/jpeg'});

Answer 2

这就是我所做的工作

// to change Blob to File
private blobToFile(theBlob: Blob, fileName: string): File {
   const b: any = theBlob;
   b.lastModifiedDate = new Date();
   b.name = fileName;
   return b as File;
}

let file;
if (!navigator.msSaveBlob) { // detect if not Edge
   file = new File([b], document.originalName, { type: document.mimeType });
} else {
   file = new Blob([b], { type: document.mimeType });
   file = this.blobToFile(file, document.originalName);
}

现在可以通过变量文件作为Edge或其他浏览器中的文件继续。

在Microsoft Edge中实例化File对象

2 个答案: