代码之家  ›  专栏  ›  技术社区  ›  Sankar

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

  •  0
  • Sankar  · 技术社区  · 6 年前

    我有一个HTTP服务,它返回类型为的HTTP响应

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

    如果我从curl调用这个HTTP服务并重定向,我会正确地重新创建.xlsx文件。但是尝试从javascript保存文件失败。我使用的代码:

    卷曲:

    $ curl -v -X POST <API_ENDPOINT> > a.xlsx ;# a.xlsx works fine
    

    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);
          }
    };
    

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

    这个 content-length 响应(curl和javascript(通过chrome devtools捕获)的头值相同,但通过curl重定向时的文件大小为5.1K(几乎与 内容长度 值),但通过JS创建的文件大小为8.5K,错误。

    我试过设置 application/octet-stream , octet/stream , application/vnd.openxmlformats-officedocument.spreadsheetml.sheet 在创建blob时,这些都没有帮助。

    我认为我在内容类型和blob创建方面搞得一团糟,但还没弄清楚到底出了什么问题。有什么帮助吗?

    1 回复  |  直到 6 年前
        1
  •  0
  •   Sankar    6 年前

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

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