File API を使用してblobオブジェクトから画像ファイルを作成し、それをフォームに追加してXHR経由で送信しようとしています。 Chromeのチャームのように機能しますが、MicrosoftEdgeでアプリがクラッシュします。
let file = new File([blobContent], "image.png");
let form = new FormData();
form.append("file", file);
ファイルをフォームに添付するためのFileAPIまたは回避策に代わるものはありますか?ブロブをフォームに追加しただけでは、画像として認識されません。
ありがとう!
現在、IE11とEdgeはFileAPIをサポートしていますが、Fileコンストラクターはサポートしていません。
あなたが投稿したリンクでcaniuse.com
、IEおよびEdgeには、ファイルコンストラクターがサポートされていないことを示すメモがあります。同じ問題が発生しました。回避策は、Blob
の代わりにFile
を使用してから、タイプを設定することでした。ブロブの。
var blob = new Blob([blobContent], {type : 'image/jpeg'});
これは私がやったことであり、機能します
// 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または他のブラウザーでファイルとして変数ファイルを続行できます。