首页 > Web开发 > 详细

js常用方法-文件导出功能

时间:2021-02-22 12:11:37      阅读:69      评论:0      收藏:0      [点我收藏+]

前端请求后台接口返回数据流调用方法进行下载

api请求

加上:responseType: ‘blob‘

 1     // 文件数据流导出
 2     postBlob: function (url, data) {
 3         return axios({
 4             method: ‘post‘,
 5             url: reqUrl + url,
 6             data: data,
 7             headers: {
 8                 ‘Authorization‘: window.sessionStorage.getItem(‘accessToken‘),
 9                 ‘IamAccessToken‘: window.sessionStorage.getItem(‘iamAccessToken‘),
10                 ‘Content-Type‘: ‘application/json‘,
11                 ‘Access-Control-Allow-Origin‘: reqUrl
12             },
13 
14             // 文件下载返回数据流
15             responseType: ‘blob‘
16         });
17     }

方法

 1 /**
 2      * @param
 3      * @returns {obj}
 4      * 文件导出功能
 5      * 文件格式:.xlsx
 6      * data:【必传】文件下载接口返回的数据流
 7      * name:导出的文件命名,不传默认为时间命名,(字符串,一般为中文+年月日时分秒,配合getCurrentDate方法)
 8      * 例:平台设备统计明细2020-10-30 15_30_56.xlsx
 9      */
10     static downloadFile(data, name) {
11         let fileName = ‘‘;
12         if (String(name) !== ‘undefined‘) {
13             fileName = String(name);
14         } else {
15             fileName = this.getCurrentDate();
16         }
17         let blob = new Blob([data], {
18             type: ‘application/vnd.openxmlformats-officedocument.spreadsheetml.sheet‘
19         });
20         let url = window.URL.createObjectURL(blob);
21         const link = document.createElement(‘a‘); // 创建a标签
22         link.href = url;
23         link.download = fileName; // 重命名文件
24         link.click();
25         URL.revokeObjectURL(url); // 释放内存
26     }

 

js常用方法-文件导出功能

原文:https://www.cnblogs.com/cytweb/p/14428989.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!