最近公司项目有一个需求,是按行业要求的一个“怪异”格式表格下载下来,后端通过表格设计器搞了一个模板,然后填充数据,前端通过接口获取到返回的 base64 格式的数据,转成表格提供下载,就用到了这个 FileSaver.js
引入 FileSaver.js
在 HTML 页面引入,我采用的是 cdn 引入
<script src="http://cdn.staticfile.org/FileSaver.js/1.3.8/FileSaver.min.js"></script>
把 base64 转成能下载的文件
先实现这个转换方法
function b64toFile(b64Data, filename, contentType) {
let sliceSize = 512;
let byteCharacters = atob(b64Data);
let byteArrays = [];
for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {let slice = byteCharacters.slice(offset, offset + sliceSize);
let byteNumbers = new Array(slice.length);
for (let i = 0; i < slice.length; i++) {byteNumbers[i] = slice.charCodeAt(i);
}
let byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}
let file = new File(byteArrays, filename, {type: contentType});
return file;
}
转换并下载表格数据
// base64Data 是服务器获取到的数据
let file = b64toFile(base64Data, 'test', 'application/vnd.ms-excel;charset=utf-8');
// 利用 FileSaver.js 下载文件为 Excel 文件
saveAs(file, "fileName.xls");
是不是 so easy 呢?