如何解决JSP中使用AJAX上传表单文件至Servlet的问题？

嘿，这个问题我之前帮不少开发者踩过坑，咱们一步步把它捋明白：

问题根源拆解 #

• 为什么serialize()拿不到文件字段？
  jQuery的serialize()方法只能序列化普通表单控件的文本值，<input type="file">对应的是二进制文件数据，它完全处理不了这类内容，自然就获取不到文件字段的有效信息。
• 为什么会报no multipart data found？
  你的表单已经设置了enctype="multipart/form-data"（这是文件上传的必要配置），但AJAX请求里没有按multipart格式传递数据，服务器接收不到符合要求的请求体，就会抛出这个错误。

正确的解决方案 #

核心是用HTML5的FormData对象来封装表单数据，它能自动处理包含文件的表单，完美适配multipart格式。

1. 修改JavaScript代码

把你的Guardar()函数里的序列化逻辑替换成FormData：

function Guardar(){ 
    // ... 模态框相关的原有代码保持不变 ...
    $("#btnGdrCaso").on("click",function(){ 
        // 直接用FormData获取整个表单的所有数据（包括文件）
        var datosCaso = new FormData($("#frmCrcnCaso")[0]); 
        
        $.ajax({ 
            url: "GuardarCaso", // Servlet名称
            type: "POST",
            contentType: false, // 必须设为false，让浏览器自动生成正确的multipart请求头
            processData: false, // 必须设为false，禁止jQuery处理FormData（否则会破坏文件数据）
            data: datosCaso,
            success:function(r){ 
                if(r === "1"){ 
                    // ... 你的成功逻辑 ...
                }else if(r === "2"){ 
                    // ... 其他业务逻辑 ...
                }else{ 
                    // ... 异常情况处理 ...
                } 
            }, 
            error:function(r){ 
                // ... 错误回调逻辑 ...
            } 
        }); 
    }); 
}

2. 确保Servlet端正确接收数据

你的Servlet需要配置成支持multipart请求，比如Java EE原生Servlet的写法：

@WebServlet("/GuardarCaso")
@MultipartConfig // 必须添加这个注解，才能处理文件上传请求
public class GuardarCasoServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // 获取普通文本字段
        String txtNoVlt = request.getParameter("txtNoVlt");
        String txtNmr = request.getParameter("txtNmr");
        
        // 获取上传的文件
        Part filePart = request.getPart("flAcvAjt");
        String fileName = filePart.getSubmittedFileName(); // 获取文件名
        // 后续可以通过filePart.getInputStream()读取文件内容，完成保存等操作
    }
}

关键注意事项 #

• 必须同时设置processData: false和contentType: false：前者禁止jQuery把FormData转成普通查询字符串，后者让浏览器自动生成带正确分隔符的multipart/form-data请求头，手动设置很容易出错。
• 表单的enctype="multipart/form-data"一定要保留，这是文件上传的基础配置。

这样修改后，既能正常传递所有文本字段，也能正确上传文件，服务器端也不会再出现找不到multipart数据的错误了。

内容的提问来源于stack exchange，提问作者StoneCoder