javascript - 是否可以将 FormData 对象中的文件列表和整个 json 对象发送到 ASP.NET CORE MVC Controller

Question

就像标题所说，如何将带有 json 对象(包括嵌套对象)和文件列表的 formdata 对象发送到 mvc Controller 。我已经尝试将对象字符串化为 json 对象，但 Controller 无法读取该属性，它读取文件列表没有问题。

这是 Controller 方法:

[HttpPost]
     public IActionResult CreateTask(Task task, IEnumerable<IFormFile> files)
        {

            //some code
        }

这是我的 JavaScript:

function createTask() {
        var formData = new FormData();
        var files = //some file objects

        var obj = {
            //some parameters 
        };


        var task = JSON.stringify(task);
        formData.append("task", task);
        formData.append("files", files);


        console.log(task);
        $.ajax({
            type: "POST",
            url: "/Task/CreateTask",
            processData: false,
            contentType: false,
            data: formData,
            success: function (data) {

            },
            error: function (data) {

            }
        })

    }

如果可能的话，我需要 Controller 方法来同时读取任务和文件列表。

Answer 1

执行此操作的唯一方法是将作为 task 发送的 JSON 绑定(bind)到字符串服务器端。然后，您必须手动将其反序列化为对象。如果它不明显，这也意味着您不会对该 JSON 对象的任何成员进行任何验证。对于 ASP.NET Core 和 modelbinder 而言，它只是一个字符串。

也就是说，我认为这里的问题是您需要上传文件，并且认为这需要以 multipart/form-data 的形式发布。您实际上可以以 JSON 形式发布，但仍然包含文件上传。但这需要进行两处更改:

1. 您必须将文件“上传”绑定(bind)到服务器端的 byte[]，而不是 IFormFile。

2. 在客户端，您必须将它们作为 Base64 编码字符串或 uint8 数组添加到要发布的 JSON 对象中。

第一部分相对简单。 modelbinder 调用的 JSON 反序列化器会自动将 Base64 编码的字符串转换为字节数组，当然 JS unint8 数组本质上只是一个字节数组。

第二部分可能需要更多讨论。您需要使用 File API 读取上传文件数据，然后将其转换为 Base64 编码的字符串或 uint8 数组:

Base64

var reader = new FileReader();
reader.onload = function(e) {
    let base64 = btoa(reader.result);
    myJsonObject.files.push(base64);
}
reader.readAsBinaryString(file);

字节数组

var reader = new FileReader();
reader.onload = function(e) {
    let bytes = Array.from(new Uint8Array(reader.result));
    myJsonObject.files.push(bytes);
}
reader.readAsArrayBuffer(file);