MacでSafari 10がXHRでファイルをアップロードしない

Question

私はCORSが有効になっている外部サーバーに画像をアップロードするのにXHRを使用しています。

Chrome、Firefox、IEではすべて正常に動作します。

しかし、Safariを使用すると、サーバーの応答はMIMEタイプエラーです。ファイルタイプが 'application/octet-stream'で、 'image/*'でなければならないと言っています。

MIMEタイプのチェックを無効にすると、Safariはファイルをアップロードできますが、空のファイルはすべて0bにアップロードされます。

誰もが知っていますか？

var xhr = new XMLHttpRequest(); 
    xhr.open('POST', 'http://up-z1.qiniu.com/', true); 
    var formData; 
    formData = new FormData(); 
    formData.append('key', file.name); 
    formData.append('token', acessToken); 
    formData.append('file', file); 
    xhr.onreadystatechange = function (response) { 
     if (xhr.readyState == 4 && xhr.status == 200 && xhr.responseText != "") { 
      callback(true,null); 
     } else if (xhr.status != 200 && xhr.responseText) { 
      callback(false,null); 
     } 
    }; 
    xhr.send(formData); 

Answer 1

だから、別のstackoverflowの質問によると、私は、Safariは、他のブラウザではfile.toBlob（）やるというバグを持っている1 覚えてカント、Safariが）（file.toStringを行います。そのため回避策は、自分のファイルをblob関数に書き込んでそのblobをアップロードすることです。

var xhr = new XMLHttpRequest(); 
xhr.open('POST', 'http://up-z1.qiniu.com/', true); 
var formData; 
formData = new FormData(); 
formData.append('key', file.name); 
formData.append('token', acessToken); 
formData.append('file', fileToBlob(file)); 
xhr.onreadystatechange = function (response) { 
    if (xhr.readyState == 4 && xhr.status == 200 && xhr.responseText != "") { 
     callback(true,null); 
    } else if (xhr.status != 200 && xhr.responseText) { 
     callback(false,null); 
    } 
}; 
xhr.send(formData);