Node.js —— Egg.js实现excel文件上传下载

关于上传

?️问题:上传excel报错400
解决:使用FormData上传数据,egg使用egg-multipart,egg-multipart有对上传文件的后缀名限制的白名单(whitelist),项目中可以在multipart.whitelist中重新定义支持文件类型,npm可以在egg-multipart/config/config-default.js中对fileExtensions进行扩展(nom run dev后生效)

前端使用antd的Upload组件,使用FormData上传

onChange = info => {
    const { dispatch } = this.props;
    if (info.file.status !== 'uploading') {
      console.log(info.file, info.fileList);
    }
    if (info.file.status === 'done') {
      console.log(`${info.file.name} file uploaded successfully`);
      const formData = new FormData();
      formData.append('file', info.file.originFileObj);
    }
}
<Upload onChange={this.onChange}></Upload>

⚠️在configdefault.js里面修改
在这里插入图片描述

关于下载

?️下载不能直接通过接口返回
下载文件的header为content-disposition: attachment; filename="write.xlsx”,
可以使用a标签请求下载文件,或document.create一个a标签,直接调用click(),如果是浏览器能打开的文件,需要设置a标签的download,在FireFox会发生跨域不能请求的问题。

前端(放置a标签,或xhr)
⚠️下面代码仅为记录问题备份,a标签测试可用,xhr传输回文件的数据有问题,对Blob不熟悉,进一步研究中

const xhh = new XMLHttpRequest();
    xhh.open("get", '/api/fetch/download/excel');
    xhh.responseType = 'blob';
    xhh.onreadystatechange = () => {
      if (xhh.readyState === 4 && xhh.status === 200) {
        const name = xhh.getResponseHeader("Content-disposition");
        const filename = name.substring(20,name.length);
        const blob = new Blob([xhh.response], {type: 'xlsx'});
        const csvUrl = URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.href = csvUrl;
        link.download = filename;
        link.click();
      }
    };
    xhh.send();

后端

await workbook.xlsx.writeFile('write.xlsx').then(async () => {
      this.ctx.attachment('write.xlsx');
      this.ctx.type = '.xlsx';
      // this.ctx.set('Content-disposition', 'attachment; filename="write.xlsx"');
      // this.ctx.set('Content-Type', 'application/octet-stream');
      this.ctx.body = fs.readFileSync('write.xlsx');
    }, function(err) {
      console.log(err);
    });
关于Excel解析

node端使用exceljs插件(另一插件待研究https://github.com/SheetJS/js-xlsx)

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值