JavaScript：使用XMLHttpRequest发送ArrayBuffer

Question

我希望通过XMLHttpRequest发送一个多部分表单。我要附加的文件是一个JPG文件。将文件附加到FormData对象中可以正常工作。

但是我想在发送之前处理图像文件。因此，我有一个库，该库以Uint8Array为输入和输出。因此，我有已处理的图像作为UInt8Array。

我尝试使用

（未完成的句子）

form.append("picture", new Blob(fileAsArray, {type: "image/jpg"} ));

但是它创建了一个八位字节流。那么我该如何通过XMLHttpRequest multipart/form发送Uint8Array，以便服务器看到的与发送文件对象时相同？

- bebo

---

使用以下代码将其转换为base64字符串：var base64Data = btoa(String.fromCharCode.apply(null, yourArray)); - adeneo

嗯，看起来这很好。你用的是什么浏览器？ - Bergi

Answer 1

请注意，Blob 构造函数需要将一个类型化数组（或其他来源）的数组作为其参数。尝试一下。

form.append("picture", new Blob([fileAsArray], {type: "image/jpg"} ));

- Bergi

Answer 2

也许这不是对问题的直接回答，但我已经创建了一个函数，使用fetch而不是XMLHttpRequest来上传ArrayBuffer作为文件。

以下是我的Javascript Fetch版本：

function uploadArrayBufferRawImage(arraybuffer)
{
    var formData = new FormData();
    formData.append("image",
                     new Blob([arraybuffer], {type: "image/x-myrawformat-raw"}),
                     new Date().toJSON() + ".raw");
    fetch("scripts/store_image.php", {
        method: 'POST',
        body: formData
    }).then(function(resp)
    {
        return resp.json();
    }).then(function(json)
    {
        console.log(json);
    });
}

- Fernando