如何在AJAX提交给WebAPI的对象属性中加入PDF内容

直接把PDF二进制数据塞进普通JSON对象里提交是行不通的——JSON没办法直接处理二进制流。正确的做法是用FormData对象来混合提交普通表单字段和文件数据，这样就能把PDF作为请求数据的一部分，和其他日期参数一起发送了。

下面是调整后的完整实现步骤和代码：

前端AJAX修改 #

先获取用户选择的PDF文件，再用FormData把所有参数（日期字段+PDF文件）打包，最后通过AJAX提交：

// 获取用户选择的PDF文件
const pdfFile = document.getElementById('btnUploadStaticPdf').files[0];
if (!pdfFile) {
    popError('请先选择PDF文件');
    return;
}

// 创建FormData对象，添加所有需要提交的参数
const formData = new FormData();
formData.append('sendDate', sendDate);
formData.append('dueDate', dueDate);
formData.append('startDate', startDate);
formData.append('endDate', endDate);
// ... 按需添加其他字段
formData.append('pdf', pdfFile); // 键名"pdf"要和后端接收的参数名对应

// 发送AJAX请求
$.ajax({
    type: 'POST',
    url: "@Url.Action(\"SubmitRequest\")",
    data: formData, // 直接传递FormData对象
    contentType: false, // 必须设为false，让浏览器自动生成带boundary的正确Content-Type
    processData: false, // 必须设为false，禁止jQuery自动处理FormData（否则会转成字符串导致解析失败）
    success: function (data) {
        // 处理成功逻辑
    },
    error: function (request, status, error) {
        popError(request.responseText);
    }
});

后端控制器Action调整 #

后端要对应接收FormData里的参数，以ASP.NET Core为例，Action可以这么写：

[HttpPost]
public IActionResult SubmitRequest(
    DateTime sendDate, 
    DateTime dueDate, 
    DateTime startDate, 
    DateTime endDate,
    // ... 其他参数
    IFormFile pdf) // 参数名"pdf"要和前端append的键名一致
{
    // 处理日期参数逻辑
    // 处理PDF文件：比如转成二进制或保存到服务器
    if (pdf != null && pdf.Length > 0)
    {
        using (var stream = new MemoryStream())
        {
            pdf.CopyTo(stream);
            byte[] pdfBytes = stream.ToArray();
            // 这里可以把二进制数据存入数据库或做其他处理
        }
    }

    return Json(new { success = true });
}

如果是老版本ASP.NET MVC，用HttpPostedFileBase接收文件：

[HttpPost]
public ActionResult SubmitRequest(
    DateTime sendDate, 
    DateTime dueDate, 
    DateTime startDate, 
    DateTime endDate,
    // ... 其他参数
    HttpPostedFileBase pdf)
{
    if (pdf != null && pdf.ContentLength > 0)
    {
        byte[] pdfBytes = new byte[pdf.ContentLength];
        pdf.InputStream.Read(pdfBytes, 0, pdf.ContentLength);
        // 处理二进制数据
    }

    return Json(new { success = true });
}

关键注意点 #

• 必须用FormData：普通JSON对象承载不了二进制文件，FormData是专门为混合表单数据（含文件）设计的格式。
• AJAX的两个核心配置：contentType: false和processData: false缺一不可，否则jQuery会错误处理FormData，导致后端无法解析。
• 参数名要严格匹配：前端formData.append的键名必须和后端Action的参数名完全一致，模型绑定才能正常工作。

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