使用 jQuery Ajax 上传文件时出现“未找到多部分边界”异常答案

【问题标题】：'no multipart boundary was found' exception while uploading file using jQuery Ajax使用 jQuery Ajax 上传文件时出现“未找到多部分边界”异常
【发布时间】：2014-01-03 18:10:49
【问题描述】：

这是我的 jQuery 代码片段

$("#uploadForm").submit(function (e) {
    $.ajax({
        url: 'uploadExcel',
        data: $('#uploadForm').serialize(),
        cache: false,
        contentType: 'multipart/form-data',
        processData: false,
        type: 'POST',
        success: function (data) {
            alert(data);
        }
    });

上传文件时出现以下错误

org.apache.commons.fileupload.FileUploadException: the request was rejected because no multipart boundary was found
    at org.apache.commons.fileupload.FileUploadBase$FileItemIteratorImpl.<init>(FileUploadBase.java:931)
    at org.apache.commons.fileupload.FileUploadBase.getItemIterator(FileUploadBase.java:331)
    at org.apache.commons.fileupload.FileUploadBase.parseRequest(FileUploadBase.java:349)
    at org.apache.commons.fileupload.servlet.ServletFileUpload.parseRequest(ServletFileUpload.java:126)
    at com.obs.controller.ExcelUploadController.doPost(ExcelUploadController.java:36)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:641)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:722)

是什么原因？如何克服？

【问题讨论】：

标签： java jquery jsp servlets file-upload

【解决方案1】：

对我来说，问题是将图像包装在表单/输入文件上。我是 javascript/Jquery 的新手，所以这真的很痛苦。我知道我的服务器端没问题，因为我写了一个简单的 html 表单并且效果很好。我正在用javascript做这个新页面来预览图像，我明白了 “未找到多部分边界”异常。

感谢chandoo，我在 StackOverflow 中找到了这个 here 的答案。

试试这个：如果表单的 id 是“upload_form”。

var formData = new FormData($('#upload_form')[0]);
formData.append('tax_file', $('input[type=file]')[0].files[0]);

$.ajax({
    url: 'uploadExcel',
    data: formData,
    cache: false,
    contentType: false, //using 'multipart/form-data' didn't work for me
    processData: false, //this is also important when you are dealing with files.
    type: 'POST',
    success: function (data) {
        alert(data);
    }
});

好看！

【讨论】：

【解决方案2】：

XMLHttpRequest 1 不支持文件上传的原因，请参阅这个 SO 问题：jQuery Ajax File Upload。您在服务器端收到错误，因为您告诉服务器期待多部分上传，但由于没有随它发送有效负载（= 数据），因此会引发错误。

您需要 FormData 和 XMLHttpRequest 2 （注意：仅限 IE10 及更高版本。所有其他浏览器都已支持它。有关详细支持信息，请参阅 Can I Use? em>)。

似乎FormData 可以是emulated in older browsers，虽然我没有亲自尝试过。

使用XMLHttpRequest 2 和FormData，您的代码将像这样工作：

$("#uploadForm").submit(function (e) {
    e.preventDefault();
    $.ajax({
        url: 'upload.ajax.php',
        data: new FormData($(this)[0]),
        cache: false,
        contentType: false,
        processData: false,
        type: 'POST',
        success: function (data) {
           console.log(data);
        }
    }); 
});

【讨论】：