如何通过JQuery Ajax POST向.Net Core MVC控制器上传带附加参数的邮件附件？

核心调整逻辑 #

• 原方案的硬伤是FileList存储的是现代浏览器返回的C:\fakepath\伪路径字符串，并非真实的文件二进制内容，后端拿到路径也无法读取客户端本地文件
• 采用原生FormData传参可以同时承载普通文本字段与文件流，完全匹配.NET Core MVC的模型绑定能力，不需要额外依赖第三方工具

前端Ajax代码改造 #

使用FormData时必须关闭jQuery的两个默认处理逻辑，否则会导致请求解析失败：

• 关闭自动设置请求头的逻辑，让浏览器自动生成multipart/form-data格式的带边界标识的请求头
• 关闭自动序列化请求参数的逻辑，避免破坏文件二进制流结构

改造后的完整代码如下：

// 初始化FormData实例承载所有传参
var formData = new FormData();

// 逐个追加普通业务字段
formData.append('RequestId', requestId);
formData.append('ToEmails', toEmails);
formData.append('CcEmails', ccEmails);

// 处理文件字段：需传入原生File对象，不能存伪路径字符串
// 键名需和后端模型的文件属性名完全一致
if (fileList?.length > 0) {
    for (let i = 0; i < fileList.length; i++) {
        formData.append('FileList', fileList[i]);
    }
}

$.ajax({
    url: '@Url.Action("SendEmails")',
    type: 'POST',
    data: formData,
    // 必须配置的两个核心参数
    contentType: false,
    processData: false,
    dataType: 'json',
    success: function (response) {
        // 接口成功回调逻辑
    }
});

注意：文件列表必须从文件选择DOM节点的.files属性获取原生File对象，不能取input.value返回的带伪路径的字符串作为文件列表值

后端代码改造 #

调整模型定义 #

原模型中FileList的字符串类型无法接收文件流，需要替换为.NET Core内置的文件接收类型IFormFile：

public class ToCcEmails
{
    public int RequestId { get; set; }
    public string ToEmails { get; set; }
    public string CcEmails { get; set; }
    // 替换原List<string> 为文件类型集合
    public List<IFormFile> FileList { get; set; }
}

调整控制器绑定逻辑 #

因为请求格式从JSON改为multipart/form-data，需要将原来的[FromBody]绑定特性替换为[FromForm]，适配表单格式的参数映射：

[HttpPost]
public bool SendEmails([FromForm]ToCcEmails emails)
{
    // 普通字段会自动完成绑定
    // emails.FileList 为上传的文件集合，可直接通过IFormFile的API读取文件名、文件大小、文件流
    if (emails.FileList?.Count > 0)
    {
        foreach (var file in emails.FileList)
        {
            // 可实现文件存储、内容读取等业务逻辑
        }
    }
    return true;
}

非推荐替代方案 #

如果需要保留原JSON格式传参，可以通过FileReader将每个文件读取为Base64字符串嵌入JSON对象，后端再对Base64字符串做解码转换为文件流。但该方案会让请求体积增加约30%，大文件场景下会出现明显的内存占用过高、传输耗时变长的问题，仅适合小文件的特殊场景，优先推荐原生FormData方案。

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