laravel框架配合前端代码生成Excel，并下载

最新推荐文章于 2023-03-06 15:13:49 发布

徐卡丘

最新推荐文章于 2023-03-06 15:13:49 发布

阅读量578

点赞数 1

CC 4.0 BY-SA版权

分类专栏： web前端 PHP 文章标签： Excel 生成

本文链接：https://blog.youkuaiyun.com/tu1425407707/article/details/95048999

web前端同时被 2 个专栏收录

4 篇文章

订阅专栏

PHP

3 篇文章

订阅专栏

本文详细介绍了一种在前端使用JavaScript生成并下载Excel文件的方法，同时涵盖了PHP后端生成Excel供前端下载的流程。前端通过拼接字符串创建Excel数据，利用Blob对象和a标签实现文件下载；后端则通过设置响应头和使用Export类生成Excel。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.前端生成excel，并下载

var dataType = "\uFEFF"; //解决乱码问题
      dataType += (["公司id", "公司全称", "精简公司全称", "重复公司"].join(','));  //添加表格的头
      dataType += '\n';
      this.mainNames.forEach(function (item) { //遍历数组，用字符串拼接
        dataType += ([item.id, item.full_name, item.check_full_name, item.repeatComs].join(','));
        dataType += '\n';
      });
    // const dateType = new Blob([JSON.stringify(this.mainNames)], {type: 'application/json'});
      var csvData = new Blob([dataType], {
        type: 'application/vnd.ms-excel'
      });
      var _a = document.createElement('a');
      _a.href = URL.createObjectURL(csvData);
      _a.target = '_blank';
      _a.download = '公司名称去重.xls';
      document.body.appendChild(_a);
      _a.click();
      document.body.removeChild(_a);

2.PHP后端生成excel，前端下载文件流

php:

$filename = 'company_full_name';
header("Content-type: application/vnd.ms-excel; charset=gbk");
header("Content-Disposition: attachment; filename=$filename.xls");
$export = new Export($export_data);
return Excel::download($export, "{$filename}.xls");

前端我用的XMLHttpRequest

//  获取时间戳
      let timestamp = new Date().getTime();
      // 获取XMLHttpRequest
      let xmlResquest = new XMLHttpRequest();
      //  发起请求
      xmlResquest.open('POST', '/api/system/exportTable', true);
      // 设置请求头类型
      xmlResquest.setRequestHeader('Content-type', 'application/json');
      xmlResquest.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); // post需要加这一个
      //  设置请求token
      // xmlResquest.setRequestHeader(
      //   'pt_session',
      //   Vue.cookie.get('pt_session')
      // );
      xmlResquest.responseType = 'blob';
      //  返回
      xmlResquest.onload = function (oEvent) {
        let content = xmlResquest.response;
        // 组装a标签
        let elink = document.createElement('a');
        // 设置下载文件名
        elink.download = timestamp + '.xlsx';
        elink.style.display = 'none';
        let blob = new Blob([content]);
        elink.href = URL.createObjectURL(blob);
        document.body.appendChild(elink);
        elink.click();
        document.body.removeChild(elink);
      };
      xmlResquest.send(JSON.stringify(this.mainNames));