在.NET Core MVC 6中使用Ajax上传文件遇ContentType错误的排查求助

首先，最关键的错误出在你的getFile()函数里——你创建了FormData对象，但没有把它返回给Ajax调用！这就导致Ajax实际上没有发送正确的文件数据，自然会触发ContentType不正确的错误。

1. 修复getFile()函数 #

你需要在函数末尾返回构建好的FormData对象，而不是只创建它。修正后的代码如下：

function getFile() {
    var input = document.getElementById("csvFile");
    if (!input || !input.files || !input.files[0]) {
        return null; // 这里返回null比";"更合理，后续可以在Ajax调用前做判断
    }
    console.log(input.files[0]);
    var data = new FormData();
    data.append("CsvDoc", input.files[0]);
    return data; // 关键：返回FormData对象
}

2. 优化控制器接收逻辑 #

虽然从Request.Form.Files取值可行，但ASP.NET Core支持直接通过参数绑定接收文件，代码更简洁易读：

[HttpPost]
public string AddFile(IFormFile CsvDoc) {
    if (CsvDoc == null || CsvDoc.Length == 0) {
        return "No file uploaded";
    }
    // 这里处理你的文件逻辑，比如保存到服务器
    return "File uploaded successfully";
}

3. 确认HTML输入控件的正确性 #

HTML中的文件输入控件需要确保是type="file"，并且最好指定name属性（和你FormData里的键一致），避免潜在的绑定问题：

<input type="file" id="csvFile" name="CsvDoc" accept=".csv" />

• accept=".csv"可以限制用户只能选择CSV文件，提升用户体验
• name属性和FormData中的键CsvDoc对应，确保模型绑定能正确识别

4. 补充Ajax调用的小优化 #

可以在Ajax调用前判断getFile()的返回值，避免发送无效请求：

function AddFileHandler() {
    var formData = getFile();
    if (!formData) {
        alert("请选择要上传的文件");
        return;
    }
    return $.ajax({
        processData: false,
        contentType: false,
        type: "POST",
        url: '@Url.Action("AddFile", "SomeController")',
        data: formData
    });
}

总结一下，核心问题就是getFile()没有返回FormData，导致Ajax发送的不是正确的多部分表单数据，进而触发ContentType错误。修复这个返回逻辑后，配合正确的HTML控件和控制器参数绑定，问题就能解决。

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