上传文件（FormData）到 WebApi答案

【问题标题】：Upload File (FormData) to WebApi上传文件（FormData）到 WebApi
【发布时间】：2017-09-06 18:56:33
【问题描述】：

我正在尝试将文件上传到 WebApi，但我没有收到该文件。另外我不知道文件是否被附加。我正在这样做：

if (this.state.file) {
            var file = this.state.file;
            if (window.FormData !== undefined) {
                var data = new FormData();
                data.append("file", file);

                $.ajax({
                    type: "POST",
                    url: "/api/service/upload",
                    contentType: "text/csv",
                    processData: false,
                    data: data,
                    success: function (result) {
                        console.log(result);
                    },
                    error: function (xhr, status, p3, p4) {
                        var err = "Error " + " " + status + " " + p3 + " " + p4;
                        if (xhr.responseText && xhr.responseText[0] == "{")
                            err = JSON.parse(xhr.responseText).Message;
                        console.log(err);
                    }
                });
            }
        }

另外，为了检查我的请求负载的内容，我尝试了这个，而不是 Ajax 调用：

                var xhr = new XMLHttpRequest;
                xhr.open('POST', '/', true);
                xhr.setRequestHeader('Content-Type', 'text/csv');
                xhr.send(data);

而且只出现：

------WebKitFormBoundary6xZnDkSOxBAxaovA Content-Disposition: form-data;名称=“文件”；文件名="Teste.csv" 内容类型：应用程序/vnd.ms-excel

------WebKitFormBoundary6xZnDkSOxBAxaovA--

【问题讨论】：

尝试从 ajax 调用中删除 contentType 选项。另外，请确认this.state.file 是文件对象而不是文件对象数组。 console.log它。
我明白了（我猜是一个文件对象）：文件 {name: "Teste.csv", lastModified: 1491903259490, lastModifiedDate: Tue Apr 11 2017 10:34:19 GMT+0100 (GMT)夏令时），webkitRelativePath：“”，大小：32...} lastModified：1491903259490 lastModifiedDate：2017 年 4 月 11 日星期二 10:34:19 GMT+0100（GMT 夏令时）名称：“Teste.csv” 大小：32 类型：“应用程序/vnd.ms-excel" webkitRelativePath : "" proto : 文件
但是我将文件附加到FormData对象后，对象只有原型，这正常吗？里面不应该有 File 对象吗？
这很正常。我正在用一些代码准备这篇文章的答案。试试看。

标签： javascript ajax asp.net-web-api file-upload

【解决方案1】：

好的，你有一个文件对象，它看起来是正确的。试试下面的代码。

var file; // Assuming this is the file object.
var formData = new FormData();
formData.append('file', file);

$.ajax({
    type : 'POST',
    url : '/api/service/upload',
    data : formData,
    dataType : 'json', // json, html whatever you like.
    contentType: false, // Change this line
    processData: false
}).done(function(res) {
    console.log(res);
}).fail(function(res) {
    console.log(res.responseText);
});

如果您在 api 服务中使用 PHP。您应该可以使用print_r($_FILES) 并在那里查看文件。

希望这会有所帮助。

【讨论】：

【解决方案2】：

如果文件不大，可以使用base64编码。将编码后的字符串数据发送到 Web api 服务。解码并使用它。

【讨论】：