我正在尝试使用 ajax 调用将上传的文件从视图发送到控制器，但该文件在控制器中被接收为 null

Question

我使用 ajax 将上传的文件从 html 视图发送到控制器，但该文件在控制器中被接收为空。我尝试使用 FormData 但没有任何反应，或者可能我没有正确使用它，当我使用 html.BeginForm() 发送文件时，它在控制器中正确读取，但我不想使用表单，因为它在提交后打开另一个页面下面是我的控制器public void Upload_SCN_CA_File(FormCollection formCollection){    if (Request != null)    {        HttpPostedFileBase file = Request.Files["UploadedFile"];        if ((file != null) && (file.ContentLength > 0) && !string.IsNullOrEmpty(file.FileName))         {            string fileName = file.FileName;            Debug.WriteLine(fileName);            string fileContentType = file.ContentType;            byte[] fileBytes = new byte[file.ContentLength];            var data = file.InputStream.Read(fileBytes, 0, Convert.ToInt32(file.ContentLength));        }    }}下面是 JQuery ajax 调用$("#upload").on("click",function () {    $.ajax({        type: "POST",        url: "/Order/Upload_SCN_CA_File",        data: {            enctype: 'multipart/form-data'        },        success: function (response) {            if (response.result == false) {                swal("Error", response.message, "error");            }            else {                swal("Success", response.message, "success");            }        }    });});下面是我的 html 视图<form>    <div class="row">        <div class="col">            <input name="UploadedFile" id="upfile" type="file" />        </div>    </div>    <div class="row">        <div class="col">            <div class="btn btn-primary rounded" id="upload" style="margin:8px">Upload</div><br>        </div>    </div></form>我希望文件能够正确发送到控制器，以便我可以正确读取它，但它被接收为空

Answer 1

您可以传递类似于以下代码的数据。

   $("#form0").submit(function (event) {

        var dataString;

        event.preventDefault();

        event.stopImmediatePropagation();

        var action = $("#form0").attr("action");

        if ($("#form0").attr("enctype") == "multipart/form-data") {

            dataString = new FormData($("#form0").get(0));

            contentType = false;

            processData = false;

        } else {

            // regular form, do your own thing if you need it

        }

        $.ajax({

            type: "POST",

            url: action,

            data: dataString,

            dataType: "json",

            contentType: contentType,

            processData: processData,

            success: function (data) {

            },

            error: function (jqXHR, textStatus, errorThrown) {

            }

        });

    });

Answer 2

您必须使用FormData API在请求中传递表单内容。您可以在点击处理程序中像这样收集它

const form = $(this).closest('form').get(0)

const data = new FormData(form)

然后将以下内容传递给ajax调用

data: data,

processData: false,

contentType: false

代替

data: {

    enctype: 'multipart/form-data'

},

processData: false使 jquery 将未经修改的 FormData 实例传递给 XHR，这是文件上传正常工作所必需的。contentType: false将使浏览器multipart/form-data自动设置内容类型。

FormData 现在可以在较旧的浏览器中运行，特别是 IE<10。