XMLHttpRequest post 传递多个参数及服务器端读取

### 如何通过 Form-Data 方式向 WebAPI 传递参数 当涉及到使用 `form-data` 向 Web API 发送数据时，通常会涉及多部分表单编码（multipart/form-data）。这种方式适合发送文件以及键值对组合的数据。 对于客户端而言，在发送请求之前需要构建一个多部分表单对象。如果采用 JavaScript 或者 jQuery 来实现这一功能，则可以通过创建 FormData 对象来完成这项工作[^1]。 下面是一个利用 JavaScript 的 XMLHttpRequest 和 FormData 对象的例子： ```javascript var formData = new FormData(); formData.append('key', 'value'); // 添加 key-value 形式的字段到 formdata 中 // 如果有文件上传需求可以如下操作： // formData.append('file', fileInputElement.files[0]); var xhr = new XMLHttpRequest(); xhr.open('POST', '/api/values'); xhr.onload = function() { console.log(xhr.responseText); }; xhr.send(formData); // 发送带有 formdata 的 post 请求 ``` 在 C# ASP.NET Core Web API 接收端，为了能够接收来自 `form-data` 提交的内容，应该调整控制器方法签名以便正确解析传入的数据。具体来说就是移除 `[FromBody]` 特性并替换为 `[FromForm]` 属性，这表明模型绑定器应从 HTTP 正文中读取 MIME 类型为 multipart/form-data 的内容。 修改后的 Web API 方法可能看起来像这样： ```csharp // POST api/values [HttpPost] public IActionResult Post([FromForm]string value) { return Ok(value); } ``` 上述代码片段展示了如何配置服务器端以接受 `form-data` 编码类型的提交，并从中提取字符串形式的简单值。需要注意的是，实际应用中可能会遇到更复杂的情况，比如处理多个输入项或是包含文件在内的混合负载等情况。