下载xlsx档案在角2与斑点

Question

我想从客户端角上用2 REST API下载XLSX文件。

我得到一个字节数组从我的GET请求的响应，我送它来下载功能与订阅：

let options = new RequestOptions({ search: params });
this.http.get(this.restUrl, options)
          .subscribe(this.download); 

使用一滴下载功能：

download(res: Response) {
let data = new Blob([res.arrayBuffer()], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;' });
FileSaver.saveAs(data, this.fileName);};

我的问题是，我的文件已损坏，所有的时间。我尝试了很多的这个，但没有工作的版本。

**也用此溶液尝试过了，它不工作（在XLSX文件仍损坏） - Angular 2 downloading a file: corrupt result，所不同的是，我的数据是一个数组缓冲区，而不是字符串或JSON，并有PDF和XLSX之间的差异。

10倍！

Answer 1

我有同样的问题，因为你的 - 通过增加responseType: ResponseContentType.Blob我掘地固定它。检查下面的代码：

public getReport(filters: ReportOptions) {
    return this.http.get(this.url, {
            headers: this.headers,
            params: filters,
            responseType: ResponseContentType.Blob
        })
        .toPromise()
        .then(response => this.saveAsBlob(response))
        .catch(error => this.handleError(error));
}

该saveAsBlob（）仅仅是对FileSaver.SaveAs的包装（）：

private saveAsBlob(data: any) {
    const blob = new Blob([data._body],
        { type: 'application/vnd.ms-excel' });
    const file = new File([blob], 'report.xlsx',
        { type: 'application/vnd.ms-excel' });

    FileSaver.saveAs(file);
}

Answer 2

之后没有任何作品。我改变了我的服务器，以相同的字节数组通过添加返回：

    response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
    response.setHeader("Content-Disposition", "attachment; filename=deployment-definitions.xlsx");

在我的客户我删除了下载功能，而不是GET部分我做：

window.open(this.restUrl, "_blank");

这是我发现它可以保存一个没有被损坏的XLSX文件的唯一途径。

如果你有一个关于如何使用BLOB做答案，请告诉我:)

Answer 3

你可以使用下面的代码：

var file = new Blob([data], { 
    type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' 
});
saveAs(file,"nameFile"+".xlsx");
deferred.resolve(data);

Answer 4

下面的解决方案在谷歌的Chrome版本58.0.3029.110（64位）为我工作。

这是一篇文章，解释了如何使用的Blob下载PDF：https://brmorris.blogspot.ie/2017/02/download-pdf-in-angular-2.html

这是一个为XLSX文件相同的原则。只要按照从文章的步骤和改变两件事情：

• 报头，代替{ '接受'： '应用/ PDF'}，使用{ '接受'： '应用/ vnd.openxmlformats-officedocument.spreadsheetml.sheet'};
• 斑点，使用相同类型的用于创建你的团块，团块的新的（[fileBlob]，{类型： '应用/ vnd.openxmlformats-officedocument.spreadsheetml.sheet'}）。

这篇文章是使用文件保护程序，但我没有。我留下了评论，在文章中，用的是我用来代替文件节电器基本解释。

Answer 5

这里是支持IE和铬/ Safari浏览器的解决方案。这里“反应”目的是从服务接收到的响应。我有这个工作归档。您可以更改类型％来自服务收到的响应。

    let blob = new Blob([response], {type: 'application/zip'});
    let fileUrl = window.URL.createObjectURL(blob);
    if (window.navigator.msSaveOrOpenBlob) {
        window.navigator.msSaveOrOpenBlob(blob, fileUrl.split(':')[1] + '.zip');
    } else {
        this.reportDownloadName = fileUrl;
        window.open(fileUrl);
    }

Answer 6

对于我的问题是，我的responseType是“文本”。相反，我需要使用“斑点”;它为我的角度7.2.15。