写文件回前端进行下载,报错:原因:CORS 头缺少 ‘Access-Control-Allow-Origin‘)

后端写文件返回前端,出现该错误。

解决

设置允许跨域

response.setHeader("Access-Control-Allow-Origin", "*");

代码

后端

public void exportTemplate(HttpServletResponse response) {
ArrayList<ActiveGifts> activeGifts = new ArrayList<>();
String fileName = DateUtil.format(new Date(), "yyyyMMddHHmmss") + "模板文件.xlsx";

// 对文件名进行URI编码
try {
// 清空response
response.reset();
response.setCharacterEncoding("UTF-8");
response.setContentType("application/vnd.ms-excel");
response.setHeader("Content-disposition", "attachment;filename=" + new String(fileName.getBytes(StandardCharsets.UTF_8), "ISO8859-1") + ";filename*=utf-8''" + URLEncoder.encode(fileName, StandardCharsets.UTF_8));
//允许跨域
response.setHeader("Access-Control-Allow-Origin", "*");
// 用 EasyExcel 写入响应输出流
EasyExcel.write(response.getOutputStream(), ActiveGifts.class).sheet("模板").doWrite(activeGifts);
} catch (IOException e) {
e.printStackTrace();
}
}

前端

activeGiftsApi.activeGiftsDownloadTemp().then((res) => {let blob = new Blob([res.data], {type: 'application/vnd.ms-excel;charset=utf-8'}) // 文件类型console.log(res.headers['content-disposition']); // 从response的headers中获取filename, 后端response.setHeader("Content-disposition", "attachment;filename=" + fileName + ".xlsx") 设置的文件名;//以=分割取数组[1]元素为文件名let filename = '123123'let url = window.URL.createObjectURL(blob);  // 创建下载链接let aLink = document.createElement("a");    // 赋值给a标签的href属性aLink.style.display = "none";aLink.href = url;aLink.setAttribute("download", filename);document.body.appendChild(aLink);   // 将a标签挂载上去aLink.click();          // a标签click事件document.body.removeChild(aLink);  // 移除a标签window.URL.revokeObjectURL(url);   // 销毁下载链接
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/59365.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

关注AI技术的应用前景,抓住未来科技发展的机遇!

在当今这个快速发展的时代&#xff0c;人工智能&#xff08;AI&#xff09;技术正以惊人的速度改变着我们的生活和工作方式。无论是在医疗、金融、教育还是制造业&#xff0c;AI的应用都在不断扩展&#xff0c;带来前所未有的机遇和挑战。关注AI技术的应用前景&#xff0c;不仅…

QinQ的基础实验

拓扑 命令 LSW1 [LSW1]vlan batch 2 3 4 Info: This operation may take a few seconds. Please wait for a moment...done. [LSW1]interface g0/0/1 [LSW1-GigabitEthernet0/0/1]port link-type hybrid [LSW1-GigabitEthernet0/0/1]port hybrid untagged vlan 2 3 [LSW…

python-读写Excel:openpyxl-(4)下拉选项设置

使用openpyxl库的DataValidation对象方法可添加下拉选择列表。 DataValidation参数说明&#xff1a; type&#xff1a; 数据类型("whole", "decimal", "list", "date", "time", "textLength", "custom"…

Elasticsearch中时间字段格式用法详解

Elasticsearch中时间字段格式用法详解 攻城狮Jozz关注IP属地: 北京 2024.03.18 16:27:51字数 758阅读 2,571 Elasticsearch&#xff08;简称ES&#xff09;是一个基于Lucene构建的开源、分布式、RESTful搜索引擎。它提供了全文搜索、结构化搜索以及分析等功能&#xff0c;广泛…

【JavaEE初阶 — 多线程】Thread的常见构造方法&属性

目录 Thread类的属性 1.Thread 的常见构造方法 2.Thread 的几个常见属性 2.1 前台线程与后台线程 2.2 setDaemon() 2.3 isAlive() Thread类的属性 Thread 类是JVM 用来管理线程的一个类&#xff0c;换句话说&#xff0c;每个线程都有一个唯一的Thread 对象与之关联&am…

论文阅读笔记:DRCT: Saving Image Super-Resolution away from Information Bottleneck

论文阅读笔记&#xff1a;DRCT: Saving Image Super-Resolution away from Information Bottleneck 1 背景1.1 问题1.2 本文提出的方法 2 创新点3 方法4 模块4.1 问题描述4.2 深度特征提取模块4.3 同任务渐进式训练策略 5 效果5.1 和SOTA方法对比 论文&#xff1a;https://arxi…

基于STM32的智能空气净化器设计

引言 本项目基于STM32微控制器设计了一个智能空气净化器&#xff0c;通过集成多个传感器模块和Wi-Fi模块&#xff0c;实现空气质量监测、净化以及远程控制功能。该系统可以实时检测环境中的空气质量&#xff0c;如PM2.5浓度、温湿度和有害气体浓度等&#xff0c;根据监测到的空…

Linux 无名管道

无名管道&#xff08;unnamed pipe&#xff09;是一种进程间通信的方式&#xff0c;通常用于父子进程之间的通信。下面是使用无名管道的基本步骤&#xff1a; pipe 调用的返回值如下&#xff1a; 成功时&#xff1a;pipe 调用成功时返回 0。失败时&#xff1a;如果 pipe 调用…

OpenHarmony与Android区别

OpenHarmony和Android是两种不同的操作系统&#xff0c;它们在设计理念、架构、技术特点以及应用场景上都有显著的区别。 是它们之间的主要区别&#xff1a; 1. 起源和所有权 Android&#xff1a;由谷歌公司开发并拥有&#xff0c;是一个广泛使用的开源操作系统&#xff0c;…

数据结构 —— 红黑树

目录 1. 初识红黑树 1.1 红黑树的概念 1.2 红⿊树的规则 1.3 红黑树如何确保最长路径不超过最短路径的2倍 1.4 红黑树的效率:O(logN) 2. 红黑树的实现 2.1 红黑树的基础结构框架 2.2 红黑树的插⼊ 2.2.1 情况1&#xff1a;变色 2.2.2 情况2&#xff1a;单旋变色 2.2…

健身房数字化转型:SpringBoot管理系统

4系统概要设计 4.1概述 本系统采用B/S结构(Browser/Server,浏览器/服务器结构)和基于Web服务两种模式&#xff0c;是一个适用于Internet环境下的模型结构。只要用户能连上Internet,便可以在任何时间、任何地点使用。系统工作原理图如图4-1所示&#xff1a; 图4-1系统工作原理…

字符串相乘(全网最快0ms方法)

一&#xff1a;题目 二&#xff1a;思路 解释&#xff1a;每次相乘的结果不进位直接放进同一个数组里&#xff0c;相同位置则新放进的结果即可&#xff0c;最后得到左图的数组&#xff0c;再对其进行进位&#xff0c;得到正确的结果 Q1&#xff1a;数组的大小取多少&#xff1…

深入浅出:解读注意力机制,让神经网络更“聪明”

1. Attention Mechanism 深入浅出&#xff1a;解读注意力机制&#xff0c;让神经网络更“聪明” 在现代人工智能中&#xff0c;注意力机制&#xff08;Attention Mechanism&#xff09; 是解锁神经网络强大表现的关键&#xff0c;尤其是对于像 Transformer 和 BERT 这样的前沿…

虚拟展厅和实景复刻有什么区别?应用场景和优势有哪些?

虚拟展厅和实景复刻在展览展示领域均扮演着重要角色&#xff0c;但二者之间存在显著的差异。以下是对这两者的详细比较&#xff1a; 一、定义与构建方式 虚拟展厅 虚拟展厅是利用数字技术和三维建模技术创建的虚拟展览环境&#xff0c;使参观者可以通过计算机、智能手机等设…

day06|计算机网络重难点之 TCP连接如何确保可靠性、拥塞控制如何实现、TCP流量控制如何实现、UDP如何实现可靠传输

day06|计算机网络重难点之 TCP连接如何确保可靠性、拥塞控制如何实现、TCP流量控制如何实现、UDP如何实现可靠传输 14.TCP连接如何确保可靠性15.既然提到了拥塞控制&#xff0c;那你能说说说拥塞控制是怎么实现的吗16.TCP流量控制是怎么实现的&#xff1f;17.UDP怎么实现可靠传…

如何删除react项目的默认图标,使在浏览器中不显示默认图标favicon.ico

要删除 React 项目的默认图标&#xff0c;使在浏览器中不显示默认图标favicon.ico&#xff0c;其实有两种方法&#xff1a; 方法一 方法要点&#xff1a;删除掉 public 目录下的 favicon.ico 文件&#xff0c;再用浏览器访问时&#xff0c;如果加载不到图标文件&#xff0c;就…

计算机网络——路由器构成

算路由表是分布式去算——你算你的&#xff0c;我算我的 输出队列非先来先传 调度发生在哪里 缓存队列一般是应对——来数据方向的速度过快问题

项目活动进度计算题

六个时间参数①最早开始时间ESmax{紧前工作最早完成时间EF}&#xff08;紧前取大&#xff09; 最早完成时间EFES工期&#xff0c;从左→右计算&#xff0c;累加取大 ②最迟完成时间LFmin{紧后工作最迟开始时间LS}&#xff08;紧后取小&#xff09; 最迟开始时间LSLF-工期&am…

练习LabVIEW第四十题

学习目标&#xff1a; 用labvIEW做一个循环闪烁指示灯&#xff0c;要能够在前面板调节周期和占空比。 开始编写&#xff1a; 前面板 一个布尔指示灯一维数组&#xff0c;两个数值输入控件&#xff1b; 程序框图 添加一个while循环&#xff0c;循环内添加初始化数组&…

工商业储能是什么,工商业储能有什么作用?

随着全球能源结构的转型和“双碳”目标的推进&#xff0c;工商业储能系统作为新型电力系统的重要组成部分&#xff0c;正逐渐成为能源管理和电力市场的关键力量。工商业储能系统通过削峰填谷、需量管理、电力现货交易等多种方式&#xff0c;不仅能够有效降低企业的用电成本&…