当前位置: 首页 > news >正文

vue下载文件

注意
请求时加入:responseType: 'blob'
url:写全了,因为前后端端口号不同
    downloadImage(imgUrl) {let formData = new FormData();formData.append('fileName', this.getFilename(imgUrl)); // 用于后端下载文件的路径axios.post('http://localhost:8080/competition/award/downloadFile', formData, {responseType: 'blob'}).then(response => {if (response.status == 200) {console.log(response)let url = window.URL.createObjectURL(new Blob([response.data])) // 将获取的文件转化为blob格式let a = document.createElement('a'); // 此处向下是打开一个储存位置a.style.display = 'none';a.href = url;// 下面两行是自己项目需要的处理,总之就是得到下载的文件名(加后缀)即可var fileName = this.getFilename(imgUrl);a.setAttribute('download', fileName+ '.jpg');document.body.appendChild(a);a.click();//点击下载document.body.removeChild(a);// 下载完成移除元素window.URL.revokeObjectURL(url);// 释放掉blob对象this.$message.success("文件下载成功") //删除弹窗} else {this.$message.error("文件下载失败")}})},getFilename(url) {// 从图片链接中提取文件名return url.substring(url.lastIndexOf('/')+1);},

注:此代码借鉴了其他博客
后端用的MinIO:

    @RequestMapping("/downloadFile")public ResponseEntity<byte[]> download(String fileName) throws Exception {return  minioUtils.download(fileName, FileConfig.awardImg);}

相关文章:

vue下载文件

注意请求时加入&#xff1a;responseType: bloburl&#xff1a;写全了&#xff0c;因为前后端端口号不同downloadImage(imgUrl) {let formData new FormData();formData.append(fileName, this.getFilename(imgUrl)); // 用于后端下载文件的路径axios.post(http://localhost:8…...

人人都是数据分析师-数据分析之数据图表可视化(下)

当前的BI报表、运营同学的汇报报告中数据图表大多为 表格、折线图、柱状图和饼图&#xff0c;但是实际上还有很多具有代表性的可视化图表&#xff0c;因此将对常见的可视化图表进行介绍&#xff0c;希望这些图表可视化方法能够更好的提供数据的可用性。 人人都是数据分析师-数…...

考勤、充电,绑身份,你的人员定位系统就缺它了!

我们做人脸识别智能发卡充电柜是要解决什么问题&#xff1f; &#xff08;1&#xff09;工地、港口等场景&#xff0c;人员流动大&#xff0c;管理难 在工地、港口等场景&#xff0c;人员组成通常比较复杂。有来自施工方、客户、各劳务队、各管理层的人员&#xff0c;以及来自…...

RocketMQ水平扩展及负载均衡详解

文章目录 Broker端水平扩展Broker负载均衡commit logProducer负载均衡Consumer负载均衡集群模式广播模式RocketMQ是一个分布式具有高度可扩展性的消息中间件。本文旨在探索在broker端,生产端,以及消费端是如何做到横向扩展以及负载均衡的。 Broker端水平扩展 Broker负载均衡…...

java接口笔记

关键字&#xff1a;interface 定义形式&#xff1a;interface 接口名 { 接口体 } 细节&#xff1a; 1.接口里的方法可以为抽象方法&#xff0c;静态方法&#xff0c;默认方法&#xff08;default 关键字&#xff09; 2.接口里的方法只能是public &#xff0c;可以不用写&a…...

安利安利-向大家推荐一个超级牛的etcd管理工具-EtcdKeeperFyne

etcd介绍 关于etcd的介绍大家可以看下这篇文章 etcd 开源仓库地址&#xff1a;EtcdKeeperFyne EtcdKeeperFyne 今天主要是向大家推荐一款使用起来特别方便的Etcd管理工具 EtcdKeeperFyne&#xff0c;具体运行起来的界面如下&#xff1a; 推荐原因 使用简单安装简单&…...

数字经济系列讲座-数字化平台(商业购物平台)

数字经济系列讲座 文章目录 钱的流向退货成本research questionLiterature review现金流发生在平台内侧平台商业模式转型Modelmodel 假设四种情形标记符利润函数&效用函数&平台效益模型构建利润对比图结论future directions讲座题目 To Adopt or not? The Impacts of…...

python3中collections模块详解

collections模块简介 collections包含了一些特殊的容器&#xff0c;针对Python内置的容器&#xff0c;例如list、dict、set和tuple&#xff0c;提供了另一种选择&#xff1b; namedtuple&#xff0c;可以创建包含名称的tuple&#xff1b; deque&#xff0c;类似于list的容器&a…...

护网面试题2.0

1.CSS和CSRF区别 通俗点讲的话&#xff1a; XSS通过构造恶意语句获取对方cookie&#xff0c; CSRF通过构造恶意链接利用对方cookie&#xff0c;但看不到cookie XSS比CSRF更加容易发生&#xff0c;但CSRF比XSS攻击危害更大 2.XSS原理 XSS&#xff08;Cross-Site Scripting&…...

学习计算机组成原理第1天(计算机发展历程)

计算机发展历程计算机硬件发展计算机软件的发展经典例题计算机硬件发展 计算机的四代变化 1&#xff09;第一代计算机&#xff08;1946-1957年&#xff09;电子管时代。特点&#xff1a;逻辑元件采用电子管&#xff1b;使用机器语言进行编程&#xff1b;主存用延迟线或磁鼓存储…...

二维字符数组与char** 关系 段错误打印

如下为错误&#xff0c;打印断错误。 具体原因参考 http://c.biancheng.net/view/2022.html 二维字符数组与char** 关系 原因&#xff1a; char a[2][20] ; 这是一个二维字符数组。 二维字符数组&#xff0c;这里相当于是两个一维字符串数组。这两个数组在内存的存放位置可以…...

从url输入到页面呈现发生了什么

从url输入到页面呈现发生了什么 1.URL解析 encodeURI / decodeURI 对整个URL的编码&#xff1a;处理空格/中文 let url "http://https://blog.csdn.net/api/ ?lx1&name科比&fromhttp://www.baidu.com/"; console.log(encodeURI(url));encodeURICompone…...

vue之--使用TypeScript

搭配 TypeScript 使用 Vue​ 像 TypeScript 这样的类型系统可以在编译时通过静态分析检测出很多常见错误。这减少了生产环境中的运行时错误&#xff0c;也让我们在重构大型项目的时候更有信心。通过 IDE 中基于类型的自动补全&#xff0c;TypeScript 还改善了开发体验和效率。…...

HDFD 回收站【Trash】机制

一、回收站 Trash 机制开启 HDFS本身是一个文件系统&#xff0c;默认情况下HDFS不开启回收站&#xff0c;数据删除后将被永久删除 添加并修改两个属性值可开启Trash功能 - (core-site.xml) <property> <name>fs.trash.interval</name> <value>1440&…...

【Redis】简介

简介 Redis是一个开源的内存数据结构存储系统&#xff0c;它支持多种数据结构&#xff08;如字符串、哈希、列表、集合、有序集合&#xff09;以及多种功能&#xff08;如事务、发布/订阅、Lua脚本执行等&#xff09;。Redis还提供了持久化功能&#xff0c;可以将数据存储到磁…...

【Go进阶】Goroutine 实现原理

目录 1、GMP模型 2、Goroutine调度策略 队列轮转 系统调用 工作量窃取...

TypeScript学习笔记之二(高级类型)

文章目录一、TypeScript高级类型1.1 class类1.2 class继承1.3 class类成员可见性1.4 readonly1.5 类型兼容性1.5.1 对象之间的类型兼容性1.5.2 接口之间类型兼容性1.5.3 函数之间类型兼容性1.6 交叉类型1.7 交叉类型(&)和继承(extends)的对比二、泛型2.1 泛型约束--指定更具…...

如何远程控制电脑?您只需要这样做

案例&#xff1a;在外面怎么远程控制电脑&#xff1f; “我学校教室有电脑&#xff0c;但我每次上课的时候还是需要带自己的电脑&#xff08;好重&#xff01;&#xff09;&#xff0c;只因为有些资料只在自己的电脑上。听说远程控制电脑可以解决这个问题&#xff0c;那如何远…...

【51单片机】:LED任务及汇编解释任务

学习目标&#xff1a; 1、用汇编或者c语言实现D1 D3 D5 D7 为一组 &#xff1b;D2 D4 D6 D8 为一组 &#xff0c;两组实现 1&#xff09;一组亮约一秒 另一组灭一秒&#xff0c;这样的互闪现象五次后 25分 2&#xff09;所有灯灭约一秒后&#xff0c; …...

从生活习惯到肠道微生物,揭秘胃肠道癌症的成因

谷禾健康 编辑​ 癌症一直是全球人类关注的重点&#xff0c;近年来癌症的发病率迅速增加&#xff0c;例如乳腺癌、前列腺癌和肺癌非常普遍。胃肠道癌在发病率和死亡率方面位居首位&#xff0c;并造成重大的社会经济负担。 胃肠道癌症包括胃癌、肝癌、食道癌、胰腺癌和结直肠癌等…...

椭圆曲线密码学(ECC)

一、ECC算法概述 椭圆曲线密码学&#xff08;Elliptic Curve Cryptography&#xff09;是基于椭圆曲线数学理论的公钥密码系统&#xff0c;由Neal Koblitz和Victor Miller在1985年独立提出。相比RSA&#xff0c;ECC在相同安全强度下密钥更短&#xff08;256位ECC ≈ 3072位RSA…...

React hook之useRef

React useRef 详解 useRef 是 React 提供的一个 Hook&#xff0c;用于在函数组件中创建可变的引用对象。它在 React 开发中有多种重要用途&#xff0c;下面我将全面详细地介绍它的特性和用法。 基本概念 1. 创建 ref const refContainer useRef(initialValue);initialValu…...

23-Oracle 23 ai 区块链表(Blockchain Table)

小伙伴有没有在金融强合规的领域中遇见&#xff0c;必须要保持数据不可变&#xff0c;管理员都无法修改和留痕的要求。比如医疗的电子病历中&#xff0c;影像检查检验结果不可篡改行的&#xff0c;药品追溯过程中数据只可插入无法删除的特性需求&#xff1b;登录日志、修改日志…...

【JVM】- 内存结构

引言 JVM&#xff1a;Java Virtual Machine 定义&#xff1a;Java虚拟机&#xff0c;Java二进制字节码的运行环境好处&#xff1a; 一次编写&#xff0c;到处运行自动内存管理&#xff0c;垃圾回收的功能数组下标越界检查&#xff08;会抛异常&#xff0c;不会覆盖到其他代码…...

重启Eureka集群中的节点,对已经注册的服务有什么影响

先看答案&#xff0c;如果正确地操作&#xff0c;重启Eureka集群中的节点&#xff0c;对已经注册的服务影响非常小&#xff0c;甚至可以做到无感知。 但如果操作不当&#xff0c;可能会引发短暂的服务发现问题。 下面我们从Eureka的核心工作原理来详细分析这个问题。 Eureka的…...

网站指纹识别

网站指纹识别 网站的最基本组成&#xff1a;服务器&#xff08;操作系统&#xff09;、中间件&#xff08;web容器&#xff09;、脚本语言、数据厍 为什么要了解这些&#xff1f;举个例子&#xff1a;发现了一个文件读取漏洞&#xff0c;我们需要读/etc/passwd&#xff0c;如…...

推荐 github 项目:GeminiImageApp(图片生成方向,可以做一定的素材)

推荐 github 项目:GeminiImageApp(图片生成方向&#xff0c;可以做一定的素材) 这个项目能干嘛? 使用 gemini 2.0 的 api 和 google 其他的 api 来做衍生处理 简化和优化了文生图和图生图的行为(我的最主要) 并且有一些目标检测和切割(我用不到) 视频和 imagefx 因为没 a…...

【从零学习JVM|第三篇】类的生命周期(高频面试题)

前言&#xff1a; 在Java编程中&#xff0c;类的生命周期是指类从被加载到内存中开始&#xff0c;到被卸载出内存为止的整个过程。了解类的生命周期对于理解Java程序的运行机制以及性能优化非常重要。本文会深入探寻类的生命周期&#xff0c;让读者对此有深刻印象。 目录 ​…...

在Mathematica中实现Newton-Raphson迭代的收敛时间算法(一般三次多项式)

考察一般的三次多项式&#xff0c;以r为参数&#xff1a; p[z_, r_] : z^3 (r - 1) z - r; roots[r_] : z /. Solve[p[z, r] 0, z]&#xff1b; 此多项式的根为&#xff1a; 尽管看起来这个多项式是特殊的&#xff0c;其实一般的三次多项式都是可以通过线性变换化为这个形式…...

Qemu arm操作系统开发环境

使用qemu虚拟arm硬件比较合适。 步骤如下&#xff1a; 安装qemu apt install qemu-system安装aarch64-none-elf-gcc 需要手动下载&#xff0c;下载地址&#xff1a;https://developer.arm.com/-/media/Files/downloads/gnu/13.2.rel1/binrel/arm-gnu-toolchain-13.2.rel1-x…...