XMLHttpRequest POST multipart/form-data

我想在JavaScript中使用XMLHttpRequest来POST一个包含文件类型输入元素的表单,这样我就可以避免页面刷新并获得有用的XML.

我可以在没有页面刷新的情况下提交表单,使用JavaScript将表单上的目标属性设置为MSIE的iframe或Mozilla的对象,但这有两个问题.小问题是目标不符合W3C(这就是为什么我在JavaScript中设置它,而不是在XHTML中设置它).主要问题是onload事件不会触发,至少不会触发OS X Leopard上的Mozilla.此外,XMLHttpRequest会产生更漂亮的响应代码,因为返回的数据可能是XML,而不是像iframe那样仅限于XHTML.

提交表单会产生如下HTTP的HTTP:

Content-Type: multipart/form-data;boundary=
Content-Length: 
--
Content-Disposition: form-data, name=""


--
Content-Disposition: form-data, name="; filename=""
Content-Type: application/octet-stream

如何获取XMLHttpRequest对象的send方法来复制上述HTTP流？

您可以自己构建'multipart/form-data'请求(在http://www.faqs.org/rfcs/rfc2388.html上阅读更多相关信息),然后使用该send方法(即xhr.send(your-multipart) -形式数据)).同样,但更容易,在Firefox 4+(也在Chrome 5+和Safari 5+中),您可以使用FormData接口来帮助构建此类请求.该send方法适用于文本内容,但如果要发送二进制数据(如图像),则可以sendAsBinary借助Firefox 3.0开始的方法来实现.有关如何通过文件发送文件的详细信息XMLHttpRequest,请参阅http://blog.igstan.ro/2009/01/pure-javascript-file-upload.html.

没有任何方法可以访问javascript中的文件输入字段,因此没有针对ajax文件上传的javascript解决方案.

有使用iframe的解决方法.

另一种选择是使用SWFUpload或Google Gears之类的东西