使用 POST FORM/AJAX 下载文件？答案

【问题标题】：Download File using POST FORM/AJAX?使用 POST FORM/AJAX 下载文件？
【发布时间】：2016-08-11 07:14:50
【问题描述】：

我需要为页面中的相应表格下载 CSV 文件。下载后我不需要执行任何操作，只需他说导出，数据就会下载到 CSV 文件中。后端代码已经准备好了，但是我该如何使用 POST。

我参考了很多建议，并尝试使用 window.open 但 POST 似乎存在问题。最后尝试创建 FORM，但现在问题是我得到了

"415 unsupported media type"

我的请求标头

Accept  text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Connection  keep-alive
User-Agent  Mozilla/5.0 (Windows NT 6.1; WOW64; rv:47.0) Gecko/20100101 Firefox/47.0
Content-Length  112
Content-Type    application/x-www-form-urlencoded

现在我的理解是解决这个问题，我的内容类型应该设置为 JSON，而这在 FORM POST 中是不可能的？

1) 我们有更好的下载文件的方法吗（对于使用 HTML 和 JS 的单页 APP）？请不要图书馆，纯 Javascript 方式，在我的项目中无法获得图书馆的批准。

2) 我该如何解决上述问题，如果不是，我还有什么其他选择？

代码：

    var form = document.createElement("form");
    form.id = formId;
    form.action = url;
    form.method = method || "POST";
    form.target = target || "_self";
    if (data) {
        for (var key in data) {
            var input = document.createElement("textarea");
            input.name = key;
            input.value = typeof data[key] === "object" ? JSON.stringify(data[key]) : data[key];
            form.appendChild(input);
        }
    }
    form.style.display = 'none';
    $('#' + containerId).append(form);
    if (!self.isEmptyObject(data)) {
        form.submit();
    }

【问题讨论】：

标签： javascript ajax csv post download

【解决方案1】：

需要从 REST 端点进行修复

包含以下代码

@Consumes({MediaType.APPLICATION_JSON, MediaType.APPLICATION_FORM_URLENCODED})

并将参数更改为

public javax.ws.rs.core.Response getExceptionDetailLogs(final @FormParam("param1") String param1,
    final @FormParam("param2") String param2) throws Exception {
    ....
}

【讨论】：

【解决方案2】：

这里我做了一个例子，确保对所有人都有帮助：

<form name="myform" id="myform" method="post" enctype= "multipart/form-data">
    <input name="uploadData" id="uploadData" type="file"/>
</form>

$("#uploadData").change(function (e) {
    $('.loading').show();
        var file_data = $('#uploadData').prop('files')[0];
        var form_data = new FormData();
        var csvhtml = '';
        form_data.append('file', file_data);
        $.ajax({
            url: '{{path('bulk_request_update_upload')}}',
            dataType: 'text',
            cache: false,
            contentType: false,
            processData: false,
            data: form_data,
            type: 'post',
            success: function (data) {
        }
    });
});

【讨论】：