xlsxファイルを角2でブロブでダウンロード

Question

xlsxファイルをアンバランス2を使用してクライアントから角度2でダウンロードします。

私が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の違い。

10x！

Answer 1

何も起こらない。 私はを加えて同じバイト配列を返すように自分のサーバーを変更：

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

私のクライアントで私は、ダウンロード機能を削除し、代わりに私がやったGET部分の：

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

これは、私は壊れていないxlsxファイルを保存することが可能であることがわかった。

あなたはブロブでそれを行う方法についての答えを持っている場合は教えてください:)

Answer 2

次のソリューションは、Google 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 '};
• Blobでは、新しいBlob（[fileBlob]、{type： 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'}）の作成に同じタイプを使用します。

この記事ではファイルセーバーを使用していますが、私はしませんでした。この記事では、ファイルセーバーの代わりに私が使ったことの基本的な説明をコメントしました。

Answer 3

私はあなたと同じ問題を抱えていました - 私はGetオプションに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の単なるラッパーです。名前を付けて保存（）：

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 4

あなたは以下のコードを使用することができます：ここで

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

Answer 5

はIEとクローム/サファリブラウザをサポートするソリューションです。ここで、「応答」オブジェクトは、サービスから受信した応答である。私はこれをアーカイブのために働いている。サービスから受け取った応答ごとにタイプを変更できます。

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