我正在编写一个小应用程序，它将信息从 React 应用程序提交到 Express 服务器的“/download”API，然后它将新文件写入本地文件系统并使用 Express res.download 在客户端下载新创建的文件() 在 fs.writeFile() 回调中。
我一直在使用常规的 html 表单提交来发布数据，但由于复杂性的增加，我已经切换到使用 Axios 并且它不再工作。
奇怪的是只有客户端的下载似乎停止了。编写文件工作正常，所有控制台日志都是相同的（“文件已下载！”下面的日志）。当我切换回表单提交时，它继续工作，所以唯一的变化是使用 Axios 发送发布请求。据我所知，一旦数据到达那里，两者之间应该没有任何区别，但我希望有人比我对此有更深入的了解。
除了在表单和 Axios 发布请求之间进行测试之外，我还尝试将 Axios 请求的内容类型从“application/json”更改为“x-www-form-urlencoded”，认为将内容类型与什么匹配发送的表格可能就是答案
以下是相关应用程序的相关代码片段：
server.js（节点 JS）
app.post('/download', (req, res) => {
console.log("Requst data");
console.log(req.body.html);
fs.writeFile("./dist/test.txt", res.body.test,
(err) => {
if(err) {
return console.log(err);
} else{
console.log("The file was saved!");
}
let file = __dirname + '/text.txt';
/*This is the issue, the file is not downloading client side for the Axios iteration below*/
res.download(file,(err)=>{
if(err){
console.log(err);
} else {
console.log(file);
/*This logs for both View.js iterations below*/
console.log("File downloaded!");
}
});
});
})
App.js（react）
handleSubmit(e){
e.preventDefault();
axios.post(`/download`, {test: "test"})
.then(res => {
console.log("REQUEST SENT");
})
.catch((error) => {
console.log(error);
});
}
render(){
return(
<div>
<View handleSubmit={this.handleSubmit} />
</div>
)
}
View.js（react）
这有效：
render(){
return(
<form action="/download" method="post">
<input type="submit">
</form>
)
}
这不会在客户端启动下载，但其他方面工作正常：
render(){
return(
<form onSubmit={this.props.handleSubmit}>
<input type="submit">
</form>
)
}
我没有收到任何错误，除了客户端下载之外，一切似乎都正常工作。
预期的结果是使用 Axios 在客户端下载文件，但事实并非如此。
更新：Bump，对此没有任何吸引力