如何通过POST正确发送二进制格式的文件？

Question

当我在没有Ajax的情况下以正常方式上传文件时，页面会重新加载，当我在Chrome元素检查器的网络选项卡中查看时，POST请求有效负载如下所示：

------WebKitFormBoundaryXseUYiNOVZKdYrTk
Content-Disposition: form-data; name="fdata[]"; filename="baby_bot.jpg"
Content-Type: image/jpeg


------WebKitFormBoundaryXseUYiNOVZKdYrTk
Content-Disposition: form-data; name="fdata[]"; filename="dyno_bones.png"
Content-Type: image/png


------WebKitFormBoundaryXseUYiNOVZKdYrTk--

但是当我尝试手动创建POST请求并通过使用FileReader对象以二进制格式读取文件内容并通过手动创建的POST请求发送二进制数据时，使用ajax发送文件，有效负载看起来像这在检查员中：

------CustomFormBoundaryXseUYiNOVZKdYrTk
Content-Disposition: form-data; name="fdata[]"; filename="baby_bot.jpg"
Content-Type: image/jpeg

a2q#¡B±Áð$RÑá3ñ%br4C&Scs¢ÂâÿÄ

------CustomFormBoundaryXseUYiNOVZKdYrTk
Content-Disposition: form-data; name="fdata[]"; filename="dyno_bones.png"
Content-Type: image/png

a2q#¡B±Áð$RÑá3ñ%br4C&Scs¢ÂâÿÄ

------CustomFormBoundaryXseUYiNOVZKdYrTk--

请注意，在POST请求的正文中，您可以看到二进制数据（由那些随机重音字符表示）。如何将我手动创建的POST请求 完全相同 与浏览器的请求完全相同，以便我从PHP处理程序脚本获得相同的结果？这里的想法是我可以模拟浏览器发送的POST请求，而不必修改PHP后端中的任何内容。

Answer 1

使用FormData对象，而不是尝试模拟POST请求数据。它易于使用，可让您轻松通过ajax发送表单数据。 FormData对象在XMLHttpRequest对象的帮助下自动创建并发送相应的POST请求。

Mozilla文档包含nice article on how to use the XMLHttpRequest object，其本身包含nice example on how to use the FormData object。