Angular“解析 http://localhost:8000/excel 期间的 Http 失败”答案

【问题标题】：Angular "Http failure during parsing for http://localhost:8000/excel"Angular“解析 http://localhost:8000/excel 期间的 Http 失败”
【发布时间】：2020-06-03 17:27:56
【问题描述】：

我尝试从 Angular 向我的 Laravel 后端发送 GET 请求。

    Route::get('excel', function () {
    return Excel::download(new PqrsExport, 'products.xlsx');
});

我订阅了这个方法

get_excel(){
    this.pqrService.getExcel().subscribe(
      resp => console.log(resp),
      err => console.log(err)
      );
  }

得到这个

HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: "http://localhost:8000/excel", ok: false, …}
headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, lazyInit: ƒ}
status: 200
statusText: "OK"
url: "http://localhost:8000/excel"
ok: false
name: "HttpErrorResponse"
message: "Http failure during parsing for http://localhost:8000/excel"
error: {error: SyntaxError: Unexpected token P in JSON at position 0 at JSON.parse (<anonymous>) at XMLHtt…, text: "PKVGSPG�D�X�[Content_Types].xml�…heets/_rels/sheet1.xml.relsPK��"}
__proto__: HttpResponseBase

【问题讨论】：

Angular 期望响应是 json 编码的，你应该返回 response()->json(Excel::download(new PqrsExport, 'products.xlsx')) 但我不认为它会工作像这样，你应该把pdf路径发送到angular。
我把return response()->json(Excel::download(new PqrsExport, 'products.xlsx')) 放在哪里？
而不是返回 Excel::download(new PqrsExport, 'products.xlsx');
它现在没有显示错误，但它也没有下载任何东西
是的，这是正常行为，响应的内容是什么？

标签： angular laravel http http-get laravel-excel

【解决方案1】：

我解决了安装FileSaver

npm i file-saver

并使用这种方式

HTML

 <button class="btn btn-success" (click)="get_excel()">Excel</button>

TS 文件

import * as FileSaver from 'file-saver';


 get_excel(){
    return this.http.get('http://localhost:8000/excel',  { responseType: 'blob' })
    .subscribe((resp: any) => {
      FileSaver.saveAs(resp, `filename.xlsx`)
    });
  }

【讨论】：