通过xmlHttpRequest将文件作为multipart发送

我可以通过XMLHttpRequest将文件作为多部分发送到servlet吗? 我正在制作一个表单并将其作为多部分提交,但不知何故,我无法成功上传它。 我不希望页面被刷新,所以它必须由ajax进行。


这只有在XHR FormData API(以前称为“XHR2”或“XHR Level 2”,当前称为“XHR高级功能”)的一部分时才可能实现。

鉴于这个HTML,

<input type="file" id="myFileField" name="myFile" />

你可以上传它如下:

var formData = new FormData();
formData.append("myFile", document.getElementById("myFileField").files[0]);

var xhr = new XMLHttpRequest();
xhr.open("POST", "myServletUrl");
xhr.send(formData);

XHR将关心适当的头文件和请求主体编码,并且在本例中文件将作为名称为myFile form-data部分在服务器端提供。

您需要记住,旧版浏览器不支持FormData API。 在caniuse.com上,您可以看到它目前在Chrome 7 +,Firefox 3.5+,Safari 5+,IE 10+和Opera 12+中实施。

另一种方法是使用jQuery Form插件。 当您的整个表单在没有任何JavaScript代码的情况下编写和运行正常时,将立即被下面一行直接渲染:

$("#formId").ajaxForm(function(response) {
    // Handle ajax response here.
});

它还支持文件上传以及隐藏的iframe技巧。 有关深入的解释,另请参阅此jQuery表单文档。 您可能只需要更改servlet代码即可截取普通(同步)和ajax(异步)请求。 有关具体示例,另请参阅此答案:使用JSP / Servlet和Ajax的简单计算器

无论如何,上传的文件应该在@MultipartConfig servlet的doPost()方法中@MultipartConfig ,如下所示:

Part myFile = request.getPart("myFile");

或者,如果您仍然使用Servlet 2.5或更早版本,请使用Apache Commons FileUpload通常的方式。 有关具体示例,另请参阅此答案:如何使用JSP / Servlet将文件上载到服务器?


用xhr发送multipart/form-data是不可能的( 更新:虽然在现代浏览器中可能用XHR2 ,但请参阅BalusC的答案)。

实现它所需的常用方法是使用常规form ,而不是使用iframe 。 这样,只有iframe在上传时被刷新。

链接地址: http://www.djcxy.com/p/46221.html

上一篇: Send a file as multipart through xmlHttpRequest

下一篇: Servlet for serving static content