前端通过Http下载后端传入的Excel（基于Angular）

最新推荐文章于 2023-02-27 19:46:12 发布

晨旭缘

最新推荐文章于 2023-02-27 19:46:12 发布

阅读量1k

点赞数 1

分类专栏： Angular Javascript 前端文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/weixin_45680024/article/details/123751706

版权

前端同时被 3 个专栏收录

24 篇文章 0 订阅

订阅专栏

Javascript

17 篇文章 0 订阅

订阅专栏

Angular

15 篇文章 0 订阅

订阅专栏

实现思路：通过Http封装的请求方法，对参数格式进行格式匹配

首先得了解Http封装的Post方法，传入对应的三个参数url，body，options，具体代码如下：

   post(url: string, body: any | null, options: {
        headers?: HttpHeaders | {
            [header: string]: string | string[];
        };
        context?: HttpContext;
        observe?: 'body';
        params?: HttpParams | {
            [param: string]: string | number | boolean | ReadonlyArray<string | number | boolean>;
        };
        reportProgress?: boolean;
        responseType: 'blob';
        withCredentials?: boolean;
    }): Observable<Blob>;

对应的Service调用Post方法，选择文件类型{responseType: ‘blob’}：

DownLoadExcel() {
      this.http.post(
      this.baseUrl + '/prf/download_file', null, { responseType: 'blob' })
      .toPromise()
      .then((res) => {
        const blob = new Blob([res], { type: 'application/vnd.ms.excel' });  //处理返回的数据
        const file = new File([blob], 'template' + '.xlsx', {
          type: 'application/vnd.ms.excel',
        });
        saveAs(file);
      });

  }