web-dev-qa-db-ja.com

Angular2でExcelファイルを正しくダウンロードする方法

これは、応答を伴うポストリクエストをXLSファイルにする私のサービスのコードです：

exportInternalOrder(body) {
        let user_token: string = this.sessionService.getToken();
        let headers = new Headers();
        headers.append('responseType', 'arraybuffer');
        headers.append('Authorization', 'Bearer ' + user_token);
        return this.http.post(this.config.exportInternalOrder, body,{
            headers: headers
        }).map(res => new Blob([res._body],{ type: 'application/vnd.ms-Excel' }));
    }

Excelファイルの応答を処理することになっています。これはそれを呼び出すコードです：

let objToSend = this.makeObjToSend(false);
this.reportingService.exportExcel(objToSend)
    .subscribe(
        data => {
            this.exportData(data);
        },
        error => {
            this.errorFilterMsg.Push({ severity: 'error', detail: 'Report exporting has failed!' });
        }
);

そして、これはファイルの保存です（何らかの理由でwindow.openは何もしません）：

exportData(data){       
        let blob = data;
        let a = document.createElement("a");
        a.href = URL.createObjectURL(blob);
        a.download = 'fileName.xls';
        document.body.appendChild(a);
        a.click();        
    }

ただし、ファイルは破損したファイルとして保存されます。 postmanとcurlを使用している間は問題ありません。任意の助けいただければ幸いです。

excelangularcontent-typeangular2-http
5
Abhishek Subradeep

responseTypeはheadersに設定しないでください。RequestOptionsArgs関数の2番目の引数として渡されるpostオブジェクトの一部であり、RequestOptionsArgsheaders、responseTypeなどが含まれています。詳しくは here を参照してください。したがって、コードは次のようになります。

import { ResponseContentType } from '@angular/http';

exportInternalOrder(body) {
    let user_token: string = this.sessionService.getToken();
    let headers = new Headers();
    headers.append('Authorization', 'Bearer ' + user_token);
    return this.http.post(this.config.exportInternalOrder, body,{
        headers: headers,
        responseType: ResponseContentType.Blob
    }).map(res => new Blob([res._body],{ type: 'application/vnd.ms-Excel' }));
}
17
Stefan Svrkota

私はこれを書いています.. Angularファイルのダウンロード機能の2つの解決策を探している他の人に役立ちます。以下のコードは私のために機能します。

import { ResponseContentType } from '@angular/http';

exportInternalOrder(body) {
    let user_token: string = this.sessionService.getToken();
    let headers = new Headers();
    headers.append('Authorization', 'Bearer ' + user_token);
    return this.http.post(this.config.exportInternalOrder, body,{
        headers: headers,
        responseType: ResponseContentType.Blob}).map(res => new Blob([res.blob()],{ type: 'application/vnd.ms-Excel' }));
}
1
Leni MadiReddy