c+html页面导出excel文件,web前端以文件流的形式导出Excel文件

一般web前端处理导出文件有两种方法：

1、服务端返回完整URL，直接打开URL即可；

2、服务端返回数据流，前端解析数据流完成导出功能；

今天主要分享下第二种方式，直接上代码(兼容ie10以上)：

// url为服务端返回的流数据

const exportParams = (url) => {

const aLink = document.createElement('a');

const blob = new Blob([url],{type: "application/vnd.ms-excel"});

// 创建一个当前文件的内存URL

const _href = URL.createObjectURL(blob);

aLink.style.display = 'none';

aLink.href = _href;

document.body.appendChild(aLink);

aLink.setAttribute('download', '用户数据.xlsx');

aLink.click();

document.body.removeChild(aLink);

// 手动释放创建的URL对象所占内存

URL.revokeObjectURL(_href);

}

其实现原理就是先把服务端返回的数据流通过URL.createObjectURL()方法转成一个URL，这个URL是存放在内存中的，URL的生命周期是和创建的它的document绑定，也就是说在document unload的时候也会得到内存释放；然后通过设置的download属性值，从而实现导出功能，最后再手动释放下创建的URL对象的内存。