使用FileSaver.js从Azure Blob存储下载损坏的文件

Question

我有一个Azure中的Excel电子表格，我使用SAS公开，下载后它说该文件已损坏。下面是代码保存和URI

var result : any= {}; 
result.fileUri = 
    "https://mystorageaccount.blob.core.windows.net/market-files/33b55b3c-8997-405c-af31-33f6f3e79daf?sv=2016-05-31&sr=b&sig=5Xw%2F4UPcdXbXrxd4mIcZUPQX%2FZzVZfDTQoTfr5V6NTY%3D&st=2017-03-16T18%3A00%3A12Z&se=2017-03-17T18%3A05%3A12Z&sp=rw"; 

this.http.get(result.fileUri).subscribe(
      (response: any) => { 
           var mediaType = 'application/octet-stream'; 
           var blob = new Blob([response._body], { type: mediaType }); 
           var filename = 'test.xlsx'; 
           saveAs(blob, filename); 
      }); 

文件下载使用正确的文件名，但是当我打开它，我得到在Excel中称该文件中的错误已损坏。

Answer 1

我不是Angular2的专家，但我认为响应主体应该转换为arraybuffer。关于如何处理它，你可以阅读SO上的this post。

以下是使用纯Javascript和FileSaver.js从Azure Blob存储下载文件的示例。

var fileUri = "https://storageaccount.blob.core.windows.net/market-files/<bolbNameAndSAS>"; 
var oReq = new XMLHttpRequest(); 
oReq.open("GET", fileUri, true); 
oReq.responseType = "arraybuffer"; 

oReq.onload = function(oEvent) { 
    var blob = new Blob([oReq.response], {type: "application/octet-stream"}); 
    var filename = 'test.xlsx'; 
    saveAs(blob, filename); 
}; 

oReq.send();