通过Javascript从HTTP API服务器保存XLSX文件

我有一个http服务，它返回类型为的http响应

Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet

如果我从curl和redirect调用这个HTTP服务，我会正确地重新创建.xlsx文件。但是，尝试从javascript保存文件失败。我正在使用的代码：

卷曲：

$curl-v-X POST>a.xlsx；#a、 xlsx工作正常

Javascript:

$http.post(<API_ENDPOINT>).then(function(response) {
          console.log(response);
          downloadFile(response.data, "b.xlsx")
});

var downloadFile = function(responseData, fileName) {
      var blob = new Blob([responseData], {
        type: 'application/vnd.ms-excel'
      });

      if (window.navigator.msSaveOrOpenBlob) {
          window.navigator.msSaveBlob(blob, fileName);
      } else {
        var a = document.createElement('a');
        var url = window.URL.createObjectURL(blob);

        document.body.appendChild(a);
        a.style = 'display: none';
        a.href = url;
        a.download = fileName;
        a.click();
        window.URL.revokeObjectURL(url);
        document.body.removeChild(a);
      }
};

$http.post（）.then（函数（响应）{
控制台日志（响应）；
下载文件（response.data，“b.xlsx”）
});
var downloadFile=函数（响应数据，文件名）{
var blob=新blob（[responseData]{
键入：“应用程序/vnd.ms excel”
});
if（window.navigator.msSaveOrOpenBlob）{
window.navigator.msSaveBlob（blob，文件名）；
}否则{
var a=document.createElement（'a'）；
var url=window.url.createObjectURL（blob）；
文件.正文.附件（a）；
a、 样式='显示：无'；
a、 href=url；
a、 下载=文件名；
a、 单击（）；
window.URL.revokeObjectURL（URL）；
文件.body.removeChild（a）；
}
};

文件已保存，但内容似乎与curl文件不同，即使服务器正在发送相同的文件

两个响应的

内容长度

头值相同（curl和javascript（通过chrome devtools捕获）），但通过curl重定向时的文件大小为5.1k（几乎与

内容长度

值相同），但通过js创建的文件大小为8.5k，并且是错误的

在创建blob时，我尝试设置

应用程序/八位字节流

，

八位字节流

，

应用程序/vnd.openxmlformats of cedocument.spreadsheetml.sheet

，但这些都没有帮助

---

我想我在内容类型和blob创建方面弄乱了一些东西，但无法找出问题所在。有什么帮助吗？

我已经解决了这个问题。如果响应类型是二进制的，$http.post方法需要设置另一个参数。我必须做出的改变是：

$http.post(<API_ENDPOINT>, null, {responseType: 'arraybuffer'});

$http.post（，null，{responseType:'arraybuffer'}）；

既然你必须得到一个blob对象并创建一个虚假的超链接才能让它真正下载，为什么还要麻烦使用AJAX来下载文件呢？您可以直接使用window.location或window.open访问下载URL（尽管端点必须响应GET而不是POST，但从语义上讲，这更有意义，因为您正在获取文件，而不是向服务器发送任何数据）。AJAX天生不适合文件下载。它需要是一个POST而不是GET，因为我需要在调用时传递一些其他参数，这将导致某种db更新。我已经清除了所有那些特定于业务逻辑的代码，为了简洁起见，我给出了这些代码。在这种情况下，您最好通过POST提交一个隐藏的表单。或者，让您的初始AJAX POST请求简单地返回一个URL，然后使用get访问该URL以实际检索文件。

$http.post(<API_ENDPOINT>, null, {responseType: 'arraybuffer'});