vue项目用Electron打包后导出文件的文件名获取不到

需求：Vue的项目导出表格，文件名根据后端返回的名字进行导出。

• 文件名在后端返回的响应头中获取

const contentDisposition = response.headers['content-disposition']
let fileName = contentDisposition.split('filename=')[1];
const link = document.createElement('a');
link.style.display = 'none';
//设置连接
link.href = URL.createObjectURL(new Blob([response.data]));
link.download = decodeURI(fileName); 
document.body.appendChild(link);
//模拟点击事件
link.click();

在浏览器中导出文件名正常导出；

• 用Electron打包成Exe程序后，导出文件的文件名消失了，排查问题发现是header头中打印的时候获取不到“content-disposition”，但是看接口的响应头里有该字段。
• 解决办法：后端设置

  response.setHeader("Access-Control-Expose-Headers", "Content-Disposition")
  response.setHeader("Content-Disposition", ...)

默认情况下，header只有六种 simple response headers （简单响应首部）可以暴露给外部：

• Cache-Control
• Content-Language
• Content-Type
• Expires
• Last-Modified
• Pragma
  这里的暴露给外部，意思是让客户端可以访问得到，既可以在Network里看到，也可以在代码里获取到他们的值。
  上面问题提到的content-disposition不在其中，所以即使服务器在协议回包里加了该字段，但因没“暴露”给外部，客户端就“看得到，吃不到”。
  而响应首部 Access-Control-Expose-Headers 就是控制“暴露”的开关，它列出了哪些首部可以作为响应的一部分暴露给外部。
  所以如果想要让客户端可以访问到其他的首部信息，服务器不仅要在heade里加入该首部，还要将它们在 Access-Control-Expose-Headers 里面列出来。**

原文链接：https://blog.csdn.net/weixin_46574499/article/details/125476080