更新

Question

我认为只需显示我想要发布到服务器的JSON对象，就可以轻松解释我的问题。请注意，我不想convert the file to a bytearray。

var myObject = {
   Name: "Foo",
   YourImages: [
      {Title: "Bar", Image: (some image uploaded/attached via html file input)},
      {Title: "Fizz", Image: (some image uploaded/attached via html file input)},
      {Title: "Buzz", Image: (some image uploaded/attached via html file input)}
   ]
}

更新

我还没有编写上传到服务器的代码，但是this excellent "fileread" directive允许我将图像分配给我的模型中的属性，这正是我所追求的。

Answer 1

简答：您希望将数据作为多部分请求发布。有关详细信息，请参阅this question and its accepted answer。

因为你说你不想做一个字节数组，所以我认为你不会想要对二进制文件进行Base64编码（这在带宽和处理时间上会很昂贵）。在这种情况下，最简单的解决方案是发送一个多部分请求，然后您的后端可以重新组合在一起。

Answer 2

在一个ajax请求中发送图像，文本和其他内容的正确方法是使用formData

var myObject = new FormData();

formData.append("Name", "Foo");
formData.append("Titles", "Bar, Fizz, Buzz");
formData.append("Image1", fileInputElement.files[0]);
formData.append("Image2", fileInputElement.files[1]);

var request = new XMLHttpRequest();
request.open("POST", "http://url.com/script_to_handle.php");

request.send(formData);

如何在每个对象“包含”上传图像的情况下发布JSON对象和数组？

更新

2 个答案: