如何在ASP.NET中通过Ajax调用支持多图上传的Web API？

没问题，我来帮你搞定用Ajax调用这个多图上传API的方案，分前端和后端两部分给你梳理清楚：

首先页面上需要准备文件上传控件、参数输入框和触发按钮，然后用FormData来包装文件和参数——这是上传文件必须用的格式，能兼容multipart/form-data要求：

<!-- 页面元素 -->
<input type="file" id="imageFiles" multiple accept="image/*">
<input type="text" id="placeId" placeholder="输入Place ID">
<label>是否主图：<input type="checkbox" id="isMain" checked></label>
<button id="uploadBtn">上传图片</button>

对应的JavaScript代码：

$(document).ready(function() {
    $('#uploadBtn').click(function() {
        // 初始化FormData对象
        const formData = new FormData();
        
        // 批量添加选中的多张图片
        const files = $('#imageFiles')[0].files;
        for (let i = 0; i < files.length; i++) {
            formData.append('uploadedImages', files[i]); // 这个key要和后端接收的名称对应
        }
        
        // 添加额外参数：place_Id和is_Main
        formData.append('place_Id', $('#placeId').val());
        formData.append('is_Main', $('#isMain').is(':checked'));

        // 发起Ajax请求
        $.ajax({
            url: '/api/Image',
            type: 'POST',
            data: formData,
            contentType: false, // 必须设为false，让浏览器自动生成正确的multipart头
            processData: false, // 必须设为false，禁止jQuery把FormData转成字符串
            success: function(res) {
                alert('上传成功！');
                console.log('返回结果:', res);
            },
            error: function(xhr, status, err) {
                alert(`上传失败：${err}`);
                console.error('错误详情:', xhr.responseText);
            }
        });
    });
});

你的原有代码只写了开头，我帮你补全完整逻辑，确保能正确接收文件和参数：

using System;
using System.IO;
using System.Threading.Tasks;
using System.Web;
using System.Web.Http;

namespace YourProjectNamespace.Controllers
{
    public class ImageController : ApiController
    {
        [Route("api/Image")]
        [HttpPost]
        public async Task<IHttpActionResult> PostImage()
        {
            // 校验请求格式
            if (!Request.Content.IsMimeMultipartContent())
            {
                return StatusCode(System.Net.HttpStatusCode.UnsupportedMediaType);
            }

            // 设置文件存储目录，确保目录存在
            string saveRoot = HttpContext.Current.Server.MapPath("~/Images/Places");
            Directory.CreateDirectory(saveRoot);

            // 创建multipart数据处理器
            var provider = new MultipartFormDataStreamProvider(saveRoot);

            try
            {
                // 读取上传的所有内容
                await Request.Content.ReadAsMultipartAsync(provider);

                // 解析place_Id参数
                if (!int.TryParse(provider.FormData["place_Id"], out int placeId))
                {
                    return BadRequest("place_Id参数格式无效");
                }
                // 解析is_Main参数
                bool isMain = bool.TryParse(provider.FormData["is_Main"], out bool result) ? result : false;

                // 处理每张上传的图片
                foreach (var fileData in provider.FileData)
                {
                    // 获取原始文件名，去除前后引号
                    string originalFileName = fileData.Headers.ContentDisposition.FileName.Trim('"');
                    // 重命名文件，避免重复（比如拼接placeId和时间戳）
                    string newFileName = $"{placeId}_{DateTime.Now:yyyyMMddHHmmssfff}_{Path.GetFileName(originalFileName)}";
                    string finalPath = Path.Combine(saveRoot, newFileName);

                    // 把临时文件移动到最终存储路径
                    File.Move(fileData.LocalFileName, finalPath);

                    // 这里可以添加数据库存储逻辑，比如记录图片路径、placeId、isMain等信息
                    // 示例：_dbContext.PlaceImages.Add(new PlaceImage { PlaceId = placeId, IsMain = isMain, FilePath = finalPath });
                }

                // 保存数据库变更（如果有）
                // await _dbContext.SaveChangesAsync();

                return Ok("所有图片上传完成");
            }
            catch (Exception ex)
            {
                return InternalServerError(ex);
            }
        }
    }
}

• 前端必设参数：contentType: false和processData: false是上传文件的核心，不能省略——否则jQuery会错误处理FormData，导致请求格式不匹配。
• 参数适配：如果需要给每张图片单独设置is_Main，可以在前端循环添加文件时，对应追加formData.append('is_Main[]', 对应值)，后端用provider.FormData.GetValues("is_Main[]")获取数组逐一处理。
• 目录权限：确保~/Images/Places目录有写入权限，否则会抛出IO异常。
• 大文件上传：如果需要上传超过默认限制的图片，要在Web.config里调整配置：

  <system.web>
    <httpRuntime maxRequestLength="1048576" /> <!-- 单位KB，这里设置为1GB -->
  </system.web>
  <system.webServer>
    <security>
      <requestFiltering>
        <requestLimits maxAllowedContentLength="1073741824" /> <!-- 单位字节，这里设置为1GB -->
      </requestFiltering>
    </security>
  </system.webServer>
  

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