一、需求
项目中有一个需求,将一个嵌套的数据导出Excel。最终思路是后端生成,将结果转化成base64格式的数据,通过接口返回给前端。
二、略述后端构建Excel的思路
考虑到要构建的Excel格式很复杂,夹杂了很多嵌套、合并之类的。所以思路如下,根据从数据库读取的数据动态的构建HTML模板,然后转为Base64。
示例:
<table style="text-align: center;100%;" border="1" cellspacing="0" cellpadding="10"> <th>标题1</th> <th>标题2</th> <th>标题3</th> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> </table>
将HTML转为base64:
byte[] fileContents = Encoding.Default.GetBytes(fileHtml); return Convert.ToBase64String(fileContents);
三、前端处理base64,,导出Excel
1、FileServer.js组件
前端使用的是vue框架,所以安装FileServer.js组件,在需要的页面引用:
import FileSaver from 'file-saver'
2、把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; }
3、转换并下载表格数据
// base64Data 是服务器获取到的数据 let file = b64toFile(base64Data, 'test', 'application/vnd.ms-excel;charset=utf-8'); // 利用FileSaver.js 下载文件为Excel文件 saveAs(file, "fileName.xls");
四、问题
通过上面的前后端配置,导出了Excel,但是打开Excel的时候出现以下错误:
当然选择“是”,能够打开Excel,也没有乱码,但是为什么会出现该错误呢?
1、原因
文件的内容是HTML格式的,但是文件名后缀缺失xls,所以才会出现该警告。
2、解决方法
(1)方法一,取消该警告提示
- win键+R键,打开“运行“,输入regedit打开“注册表编辑器”
- 找到HKEY_CURRENT_USERSOFTWAREMicrosoftOffice16.0ExcelSecurity,选中“Security”
- 在右边,右击鼠标,新建 - DWORD(32位)值- 名称改为“ExtensionHardening” - 值改为0