Express 在后端使用excel4node在前端下载excel文件

我知道以前有人问过这个问题，但我无法让它起作用。后端使用wb.write（'filename.xlsx'，res）发送文件，但在前端，我只得到一个对象响应。如何让浏览器下载.xlsx文件

//express后端
const x1=require（'excel4node'）；
路由器.get（'/excel'，异步（req，res）=>{
const wb=new x1.Workbook（）；
//做点什么
wb.write（'excel.xlsx'，res）；
});

//前端
轴（配置）。然后（（分辨率）=>{
//我在这里做什么？res是一个对象。我如何处理此响应，以便浏览器下载文件？
}).捕获（…）；

尝试blob响应类型

axios.request({url,method,responseType: 'blob'})
.then(({ data }) => {
const downloadUrl = window.URL.createObjectURL(new Blob([data]));

---

负责前端侧

您可以按如下方式编写axios代码：

axios.get('URL TO GET FILE BLOB', {
 responseType: 'blob'
}).then(response => {
   let headerLine = response.headers['content-disposition'];
   let startFileNameIndex = headerLine.indexOf('"') + 1
   let endFileNameIndex = headerLine.lastIndexOf('"')
   let filename = headerLine.substring(startFileNameIndex, endFileNameIndex)
   const url = window.URL.createObjectURL(new Blob([response.data], 
   {type:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'}));
   const link = document.createElement('a');

   link.href = url;
   link.setAttribute('download', filename);
   document.body.appendChild(link);
   link.click();
   link.remove();
}).catch(error => {
   console.log(error)
})

后端：

您需要确保正确配置了CORS，请检查下面的代码以供参考

const express = require('express');
const xl = require('excel4node');
const cors = require('cors')  //use this

const app = express();
app.use(cors({exposedHeaders: '*'})) //and this
const PORT = process.env.PORT || 3001;

app.get('/', (req, res) => {
  var wb = new xl.Workbook();
 
  // Add Worksheets to the workbook
  var ws = wb.addWorksheet('Sheet 1');
  var ws2 = wb.addWorksheet('Sheet 2');
 
  // Create a reusable style
  var style = wb.createStyle({
    font: {
      color: '#FF0800',
      size: 12,
    },
    numberFormat: '$#,##0.00; ($#,##0.00); -',
  });
 
 // Set value of cell A1 to 100 as a number type styled with 
 ws.cell(1, 1)
    .number(100)
    .style(style);
 
 // Set value of cell B1 to 200 as a number type styled with 

paramaters of style
ws.cell(1, 2)
  .number(200)
  .style(style);
 
// Set value of cell C1 to a formula styled with paramaters of style
ws.cell(1, 3)
  .formula('A1 + B1')
  .style(style);
 
// Set value of cell A2 to 'string' styled with paramaters of style
ws.cell(2, 1)
  .string('string')
  .style(style);
 
// Set value of cell A3 to true as a boolean type styled with paramaters of style but with an adjustment to the font size.
ws.cell(3, 1)
  .bool(true)
  .style(style)
  .style({font: {size: 14}});

wb.write('Excel.xlsx', res);
});

app.listen(PORT, () => console.log(`Server is listening on port ${PORT}`));

在前端，我们可以从内容处理头中提取文件名和扩展名。 这是我们设定的相同名称

---

wb.write（'Excel.xlsx'，res）
很有效，谢谢！我只需要确保文件的扩展名设置正确，否则我会收到文件已损坏的消息。否则，其他一切都很好。我已经修改了代码，请检查，这次您将通过内容处置头从后端获取名称。您不必再担心扩展。