Html 5 upload file , ajax , jquery

Question

我正在尝试通过jquery上传文件，所以我想做的是使用ajax POST方法并使用参数file将上传的文件发布到url:"/files/uploads"，所以我有这个输入

<form id="fileUploadForm">
    <label class="btn-bs-file btnAddFile btn btn-lg btn-primary">
          <span class="fa fa-plus"></span>
              <span>Add New File</span>
                  <input type="file" id="fileInputUpload" />
                  <input type="submit" value="Submit" id="btnSubmit"/>
     </label>
</form> 

这就是我尝试发布到服务器的方式

$("#btnSubmit").click(function (event) {
        //stop submit the form, we will post it manually.
        event.preventDefault();
        // Get form
        var form = $('#fileUploadForm')[0];
        // Create an FormData object
        var file = new FormData(form);
        // If you want to add an extra field for the FormData
        file.append("CustomField", "This is some extra data, testing");
        // disabled the submit button
        $("#btnSubmit").prop("disabled", true);
        $.ajax({
            type: "POST",
            url: "/files/uploads",
            data: {file:file},
            processData: false,
            contentType: false,
            cache: false,
            timeout: 600000,
            success: function (data) {

            },
            error: function (e) {

            }
        });
    });

Answer 1

这一行是错误的：

data: {file:file},

它应该是：

data: file,

此外，您需要为文件输入命名，它应该是：

<input type="file" name="file" id="fileInputUpload">