Question

我一直在网上寻找这个问题的答案，但我似乎无法找到任何有用的东西，我有以下控制器代码：

[HttpPost]
public ActionResult UploadFiles()
{
    // If files exist
    if (Request.Files != null && Request.Files.Count > 0)
    {
        // ** Do stuff

        return Json(new { result = true, responseText = "File(s) uploaded successfully" });
    }

    // Return no files selected
    return Json(new { result = false, responseText = "No files selected" });
}

在我的cshtml页面中的代码可以正常工作，控制器可以看到我上传的文件：

<input type="file" name="files" id="files" accept="image/*;capture=camera" multiple>
<button type="button" onclick="submitform()">Submit</button>

<script>
    function submitform(){

        // Get files from upload
        var files = $("#files").get(0).files;

        // Create form data object
        var fileData = new FormData();

        // Loop over all files and add it to FormData object
        for (var i = 0; i < files.length; i++) {
            fileData.append(files[i].name, files[i]);
        }

        // Send files to controller
        var xhr = new XMLHttpRequest();
        xhr.open("POST", "/Quotes/QuoteFiles/UploadFiles", false);
        xhr.send(fileData);     
    }

</script>

但是，当我尝试使用Ajax调用将其更改为如下所示时，Controller中的Request.Files始终没有文件。我改变的唯一一点是＆＃34;将文件发送到控制器＆＃34;部分：

<input type="file" name="files" id="files" accept="image/*;capture=camera" multiple>
<button type="button" onclick="submitform()">Submit</button>

<script>
    function submitform(){

        // Get files from upload
        var files = $("#files").get(0).files;

        // Create form data object
        var fileData = new FormData();

        // Loop over all files and add it to FormData object
        for (var i = 0; i < files.length; i++) {
            fileData.append(files[i].name, files[i]);
        }

        // Send files to controller
        $.ajax({
            url: '/Quotes/QuoteFiles/UploadFiles',
            type: "POST",
            contentType: false, // Not to set any content header
            processData: false, // Not to process data
            data:  fileData,
            success: function (result) {
                alert(result);
            },
            error: function (err) {
                alert(err.statusText);
            }
        });

    }

</script>

我在谷歌浏览器中运行此功能，但我已经尝试过IE 11和Edge，但没有使用它们。谁能告诉我我做错了什么？

Answer 1

尝试使用fileReader而不是formData，并将mimetype更改为＆＃39; text / plain;字符集= X-用户定义二进制＆＃39;

https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications#Example_Uploading_a_user-selected_file

Answer 2

我终于找到了导致此问题的原因，我在_Layout.cshtml页面上有以下代码，可以在我发出的任何ajax请求上自动发送AntiForgeryToken，这似乎导致问题，因为一旦我删除它Request.Files不是空的。我现在需要看看我是否能找到一种方法将这些代码添加回来，它不会阻止文件上传工作：

$(document).ready(function () {
    var securityToken = $('[name=__RequestVerificationToken]').val();
    $(document).ajaxSend(function (event, request, opt) {
        if (opt.hasContent && securityToken) {   // handle all verbs with content
            var tokenParam = "__RequestVerificationToken=" + encodeURIComponent(securityToken);
            opt.data = opt.data ? [opt.data, tokenParam].join("&") : tokenParam;
            // ensure Content-Type header is present!
            if (opt.contentType !== false || event.contentType) {
                request.setRequestHeader("Content-Type", opt.contentType);
            }
        }
    });
});

****编辑****

我现在已经重新设计了这个，如下所示添加＆＃39; if（opt.data！=＆＃34; [object FormData]＆＃34;＆＃39;通过不调用代码来解决问题这是一个文件上传：

$(document).ready(function () {
    var securityToken = $('[name=__RequestVerificationToken]').val();
    $(document).ajaxSend(function (event, request, opt) {
        if (opt.hasContent && securityToken) {   // handle all verbs with content
            // If not "FormData" (i.e. not a file upload)
            if (opt.data != "[object FormData]")
            {
                 var tokenParam = "__RequestVerificationToken=" + encodeURIComponent(securityToken);
                opt.data = opt.data ? [opt.data, tokenParam].join("&") : tokenParam;
                // ensure Content-Type header is present!
                if (opt.contentType !== false || event.contentType) {
                    request.setRequestHeader("Content-Type", opt.contentType);
                }
             }

         }
     });
 });

MVC Jquery文件上传Request.Files始终为空

2 个答案: