响应POST请求下载文件

Question

我正在尝试创建一个API端点，该端点接受多个文件(这就是为什么我需要POST请求，而不是GET请求(，并使用另一个文件进行响应。我希望浏览器呈现一个"；另存为…"；对话框(或者只是开始下载(。

这是一个不起作用的演示代码(Flask(：

@app.route('/api', methods=['POST'])
def api():
return send_file('./sample.txt', as_attachment=True)

我可以看到正确的响应标头，但在浏览器中什么也没发生：

HTTP/1.0 200 OK
Content-Disposition: attachment; filename=sample.txt
Content-Length: 612
Content-Type: text/plain; charset=utf-8

如果我从端点中删除methods=['POST']并向其发出GET请求，它工作正常，浏览器会询问我是否要保存此文件。

我做错了什么，或者事情就是这样(POST响应忽略了内容处置？(

Answer 1

似乎浏览器显示用于下载的弹出窗口，仅用于GET请求。但有一种方法可以从客户端显示出来。类似这样的东西：

document.getElementById('download').addEventListener('click', function () {
var content = document.getElementById('content').value;
var request = new XMLHttpRequest();
request.open('POST', '/api', true);
request.setRequestHeader('Content-Type', 'text/plain; charset=UTF-8');
request.responseType = 'blob';
request.onload = function() {
if(request.status === 200) {
var filename = 'sample.txt';
// The actual download
var blob = new Blob([request.response], { type: 'text/plain' });
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = filename;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
// some error handling should be done here...
};
request.send('content=' + content);
});

更多细节在这个问题和这个后