.NET Core FromForm接口无法捕获React传参的图片与数组字段

核心问题定位 #

• .NET Core 内置表单绑定器对multipart/form-data格式的解析规则有明确限制：仅能识别与入参模型属性路径完全匹配的表单字段，无法自动对表单字段中的JSON字符串执行反序列化，也无法稳定识别嵌套在泛型属性层级下的文件、集合类字段。Postman场景下可正常捕获图片的核心原因，是其构造multipart请求时严格匹配字段路径、自动携带正确的boundary分隔标识，与React前端当前的错误构造逻辑完全不同。
• 前端提交逻辑存在三个明确错误，直接导致后端解析失败：
  • 手动在请求头硬编码content-type: multipart/form-data，丢失了FormData解析必须的boundary分隔标识，后端无法拆分请求体的各字段边界
  • 将整个Product对象序列化为单段JSON字符串，塞进FormData的data字段，后端表单绑定器不会对这个字符串值执行JSON反序列化，最终request.data下的所有List、基础类型字段全为默认空值
  • 完全没有将图片文件追加到FormData实例中，仅传递了序列化的产品文本信息，自然无法捕获到IFormFile类型的图片字段
• 模型设计上的兼容问题：将IFormFile类型字段放在嵌套的泛型对象ProductCreateRequest中，本身就不符合.NET Core Form绑定的最优识别逻辑，即使字段路径完全匹配，也存在绑定失败的概率。

可落地修复步骤 #

前端调整 #

• 删除axios配置中手动设置的content-type请求头，让浏览器根据传入的FormData实例自动生成带正确boundary的multipart请求头
• 按照.NET Core Form绑定的字段命名规则拼接FormData内容，替代原来单段JSON序列化的方式：
  • 基础类型字段按模型路径追加：如商品单价对应字段名data.UnitPrice，分类ID对应data.CategoryId
  • 嵌套List类型字段按索引拼接：如技术参数列表按data.TechnicalInfos[0].参数名、data.TechnicalInfos[1].参数名的结构逐字段追加
  • 图片文件按集合字段路径追加：对每张图片执行formData.append('data.ProductImages', fileItem)，多次追加同名字段即可匹配后端的IEnumerable<IFormFile>集合
  • 外层ApiRequest的公共字段（如Language）直接按属性名Language追加

后端可选优化（降低前端拼接复杂度） #

• 将文件接收逻辑从嵌套的ProductCreateRequest模型中拆出，作为接口的独立入参：新增IFormFile[] ProductImages参数，与[FromForm] ApiRequest<ProductCreateRequest> request并列接收，避免嵌套层级下的文件绑定失效
• 如果希望保留前端传单段JSON字符串的简单逻辑，可将入参改为接收两个独立表单字段：一个为data对应的JSON文本字符串，一个为独立的图片数组字段；在接口内部手动通过JSON反序列化把字符串转为目标模型，再将图片数组赋值给对应模型属性即可

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