如何使用 XMLHttpRequest 和 formdata 将文件发送到服务器答案

【问题标题】：How to send a file to the server using XMLHttpRequest and formdata如何使用 XMLHttpRequest 和 formdata 将文件发送到服务器
【发布时间】：2014-02-15 19:25:49
【问题描述】：

我查看了一些文章，但似乎无法使用 XMLHttpRequest 和 FormData 对象成功地将文件发送到服务器。

当我在 upload.aspx 文件的页面加载中调试我的 c# .net 代码时，请求对象的 files 属性的计数始终为 0。

我遗漏了哪一部分，以便我可以将文件异步发送到服务器？

--HTML

<input type="file" id="upload" accept="image/*" onchange="handleFile(this.files)" name="file" />

--js

function handleFile(files) {

    var fileReader = new FileReader();
    var file = files[0];
    var imageElem = document.createElement("img");
    debugger
    fileReader.onload = (function (img) { return function (e) { img.src = e.target.result; }; })(imageElem);

    fileReader.readAsDataURL(file);

    document.getElementById("images").appendChild(imageElem);

    uploadFile(file);
}

function uploadFile(file) {
    debugger
    var formData = new FormData();
    formData.append("file", file);
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "/upload.aspx", true);
    xhr.setRequestHeader("Content-Type", "multipart/form-data");
    xhr.setRequestHeader("X-File-Name", file.name);
    xhr.setRequestHeader("X-File-Size", file.size);
    xhr.setRequestHeader("X-File-Type", file.type);
    xhr.send(formData);
}

--C#

protected void Page_Load(object sender, EventArgs e)
{
    HttpPostedFile file = null;
    if (Request.Files.Count > 0)
    {
        file = Request.Files[0];
        //file.SaveAs(Server.MapPath("~/myfile.txt"));
    }
}

--快照

--------------------在这里找到答案-------------------- ---------------

File API File Upload - Read XMLHttpRequest in ASP.NET MVC

【问题讨论】：

标签： c# xmlhttprequest .net-4.5 multipartform-data filereader

【解决方案1】：

您只需要删除这行代码：

xhr.setRequestHeader("Content-Type", "multipart/form-data");

希望对你有帮助！

【讨论】：