使用FileSaver错误下载Angular 5文件

时间:2018-03-22 06:46:42

标签: angular filesaver.js

我尝试使用角度和休息服务(java,spring-boot)下载文件,但我在角度方面面临FileSaver的问题。

这是角侧的代码

    public searchAndDownload(searchRequest:any){
        const headers = new HttpHeaders();
        headers.append('Accept', 'text/csv');
        console.log('searching and downloading');
        return this.http.get('../download/', 
            {'observe':'response','params': searchRequest, 'headers': headers, 
         'responseType':'text'}).toPromise().then(res=>{
      this.saveToFileSystem(res);
    });
  }

  private saveToFileSystem(response) {
    console.log("file download response:", response);

    const contentDispositionHeader: string = response.headers.get('Content-Disposition');
    const parts: string[] = contentDispositionHeader.split(';');
    const filename = parts[1].split('=')[1];
    const blob = new Blob([response['body']], { type: 'text/csv' },);
    /*var url= window.URL.createObjectURL(blob);
    window.open(url);*/
    saveAs(blob,"search-csv.csv");
  }

我在saveAs函数

中看到以下错误
    ERROR Error: Uncaught (in promise): TypeError: Object(...) is not a function
TypeError: Object(...) is not a function
    at DownloadService.webpackJsonp../src/app/download-service.service.ts.DownloadService.saveToFileSystem (download-service.service.ts:39)
    at download-service.service.ts:26
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4749)
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.webpackJsonp../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:858
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4740)
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at DownloadService.webpackJsonp../src/app/download-service.service.ts.DownloadService.saveToFileSystem (download-service.service.ts:39)
    at download-service.service.ts:26
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4749)
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.webpackJsonp../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:858
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4740)
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at resolvePromise (zone.js:809)
    at zone.js:861
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4740)
    at ZoneDelegate.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.webpackJsonp../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.webpackJsonp../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:500)
    at invokeTask (zone.js:1517)
    at XMLHttpRequest.globalZoneAwareCallback (zone.js:1543)

我可以正确查看标题的响应。事实上,我可以下载该文件,如果我直接从浏览器点击网址。

版本: " @ angular / core":" ^ 5.2.0" "文件保护程序":" ^ 1.3.4" " @ types / file-saver":" ^ 1.3.0",

我是角色5的新手,我错过了什么吗?

我按照this链接编写了上述代码。对http.get选项进行了少量更改,使其在角度5中工作。

0 个答案:

没有答案