javascript - Mac 上的 Safari 10 无法在 XHR 中上传文件

Question

我正在使用 XHR 将图像上传到启用了 CORS 的外部服务器。

在 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() 时，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);