vue 文件下载

1.返回路径下载

注: 针对一些浏览器无法识别的文件格式(如pdf、xls、ppt)。可以直接在地址栏上输入URL即可触发浏览器的下载功能。

情况1

 //地址栏输入文件URL
 window.location.href = URL
 window.open(URL)

注:该方式将下载逻辑放在后端处理,后端给出固定的url,前端使用window.location.herf下载
路径可以是相对路径也可以是绝对路径

情况2

注:直接下载 (使用a标签download属性)

<a  :href="scope.row.vPath" :download="scope.row.vName" class="downloadBtn">
      <el-button type="text">下载</el-button>
</a>

2.OSS存储方式的文件地址

注:这种方式的文件地址被访问时,访问文件路径默认是下载还是预览跟后端设置的服务器配置有关。

如果访问oss地址的文件只能预览,那么这种文件要下载的解决方式:

1.

  • 改为请求接口得到流的方式下载(可能面临大文件时接口请求时间非常长的问题)
  • 直接访问文件地址,在地址后添加参数 ?response-content-type=application%2Foctet-stream

链接如

https://XXX.XX.XXX:5443/alibaba/16583.pdf

<a href="http://xxxx/octet-stream" target="_blank" download="" ></a>

3.通过后端反回流,前端进行下载

代码详:<<vue Blob流及文件流下载>>篇:

平台返回二进制流格式如图

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

面试时如何回答接口测试怎么进行

一、什么是接口测试 接口测试顾名思义就是对测试系统组件间接口的一种测试&#xff0c;接口测试主要用于检测外部系统与系统之间以及内部各个子系统之间的交互点。测试的重点是要检查数据的交换&#xff0c;传递和控制管理过程&#xff0c;以及系统间的相互逻辑依赖关系等。 …

权限提升-Linux系统权限提升篇VulnhubCapability能力LD_Preload加载数据库等

知识点 1、Web或用户到Linux-数据库类型 2、Web或用户到Linux-Capability能力 3、普通用户到Linux-LD_Preload加载so配合sudo 章节点&#xff1a; 1、Web权限提升及转移 2、系统权限提升及转移 3、宿主权限提升及转移 4、域控权限提升及转移 基础点 0、为什么我们要学习权限…

Python接口自动化 —— 什么是接口测试、为什么要做接口测试?

简介 上一篇和大家一起科普扫盲接口后&#xff0c;知道什么是接口&#xff0c;接口类型等&#xff0c;对其有了大致了解之后&#xff0c;我们就回到主题-接口测试。 什么是接口测试 接口测试是测试系统组件间接口的一种测试。接口测试主要用于检测外部系统与系统之间以及内部各…

C语言-冒泡排序算法

题目描述 设计一个程序&#xff0c;实现冒泡排序算法&#xff0c;并输出{9,8,7,6,5,4,3,2,1,0} 的排序过程。 输出 每个排序过程输出一行&#xff0c;直到排序完成。 样例输出 Expected 9 8 7 6 5 4 3 2 1 0 0 9 8 7 6 5 4 3 2 1 0 1 9 …

HDLbits 刷题 -- Always if

学习&#xff1a; An if statement usually creates a 2-to-1 multiplexer, selecting one input if the condition is true, and the other input if the condition is false. always (*) beginif (condition) beginout x;endelse beginout y;end end This is equivalent …

衍生品交易概况

场内 场外 交易台架构 报价、交易、研究、程序个股、股指Flow、Exotic线性、非线性 对冲管理 管理风险敞口 做好情景分析 尊重市场选择 及时调整策略 理解头寸 善于学习 场外衍生品交易员的一天 盘前 回顾市场、决定今天总体方向处理隔夜敞口 盘中 处理客户询价…

关于 HEAP CORRUPTION DETECTED:after Normal block 错误的原因及解析

目录 一、HEAP CORRUPTION DETECTED:after Normal block 出现的报错情况&#xff1a; 二、问题原因&#xff08;重要&#xff09;&#xff1a; 三、举例 1.错误代码如下&#xff1a; 2.错误原因及分析&#xff08;重要&#xff09;&#xff1a; 3.解决方法 ​编辑 4.正…

两数之和-考察哈希表的运用

题目 给定一个整数数组 n u m s nums nums和一个整数目标值 t a r g e t target target&#xff0c;请你在该数组中找出和为目标值 t a r g e t target target的那 两个整数&#xff0c;并返回它们的数组下标。 你可以假设每种输入只会对应一个答案。但是&#xff0c;数组中同…

计算机网络数据链路层知识总结

物理层知识总结传送门 计算机网络物理层知识点总结-CSDN博客 功能 功能概述 一些基本概念 结点:主机、路由器链路﹔网络中两个结点之间的物理通道&#xff0c;链路的传输介质主要有双绞线、光纤和微波。分为有线链路、无线链路。数据链路︰网络中两个结点之间的逻辑通道&a…

“数字化”持续走热,VR全景助力制造业上“云”

制造业要升级&#xff0c;数字化改造是重要途径。 早年间&#xff0c;由于对数字化的认识不足&#xff0c;一些企业明明有数字化改造需求&#xff0c;却不敢、不愿、不会上“云”。直到此次两会期间&#xff0c;2024年政府工作报告再次提出推动制造业数字化转型&#xff0c;越…

第十三届蓝桥杯JavaA组省赛真题 - 求和

解题思路&#xff1a; 这&#xff0c;真的是&#xff0c;省赛真题吗... public class Main {public static void main(String[] args) {long res 0;for (int i 1; i < 20230408; i) {res i;}System.out.print(res);} }

MYSQL——索引分类索引语法

索引分类 索引分类 在MySQL数据库&#xff0c;将索引的具体类型主要分为以下几类&#xff1a;主键索引、唯一索引、常规索引、全文索引。 当你在创建表的时候&#xff0c;给某个字段加上主键约束&#xff0c;实际上就是在这个字段上创建了一个主键索引。给某个字段加上唯一约…

​数据结构—栈操作经典案例

括号匹配&#xff1a; 这是我最开始写的&#xff0c;运行有问题 对于输入的括号序列&#xff0c;建议使用标准的 C 字符串而不是字符数组。 #include<iostream> using namespace std;typedef char SelemType; typedef int Status; #define OK 1 #define MAXSIZE 100 #…

Mysql数据库:故障分析与配置优化

目录 前言 一、Mysql逻辑架构图 二、Mysql单实例常见故障 1、无法通过套接字连接到本地MySQL服务器 2、用户rootlocalhost访问被拒绝 3、远程连接数据库时连接很慢 4、无法打开以MYI结尾的索引文件 5、超出最大连接错误数量限制 6、连接过多 7、配置文件/etc/my.cnf权…

element UI中设置图片的高度并支持PC和手机自适应

系列文章目录 一、elementui 导航菜单栏和Breadcrumb 面包屑关联 二、element UI左侧导航菜单栏与main区域联动 三、element UI中设置图片的高度并支持PC和手机自适应 文章目录 系列文章目录前言一、实现步骤设置图片的高度以适应不同的设备&#xff1a; 二、项目应用最终效…

【Laravel】06 数据库迁移工具migration

【Laravel】06 数据库迁移工具migration 1.migration文件目录2. 举例 1.migration文件目录 2. 举例 (base) ➜ example-app php artisan migrate Migration table created successfully. Migrating: 2014_10_12_000000_create_users_table Migrated: 2014_10_12_000000_crea…

学习笔记——C语言基本概念指针(下)——(8)

1.指针和数组 数组指针 -- 指向数组的指针。 指针数组 -- 数组的元素都是指针。 换句话理解就是&#xff1a;数组指针就是个指针&#xff0c;指针数组就是个数组。 1.1数组指针 数组指针&#xff1a;指向数组的指针&#xff1b; 先回顾一下数组的特点&#xff1a; 1.相…

最大连续1的个数 Ⅲ【滑动窗口】

文章目录 往期滑动窗口上上期&#xff1a;滑动窗口0.1分析0.2 暴力求解【超时】0.3 滑动窗口 上期&#xff1a; 滑动窗口1.1暴力哈希1.2滑动窗口 本期 往期滑动窗口 上上期&#xff1a;滑动窗口 0.1分析 这道题要求的是一个区间 是区间就有【第一个元素】 即起始位置 0.2 暴…

算法学习——LeetCode力扣动态规划篇1(509. 斐波那契数、70. 爬楼梯、746. 使用最小花费爬楼梯、62. 不同路径、63. 不同路径 II)

算法学习——LeetCode力扣动态规划篇1 509. 斐波那契数 509. 斐波那契数 - 力扣&#xff08;LeetCode&#xff09; 描述 斐波那契数 &#xff08;通常用 F(n) 表示&#xff09;形成的序列称为 斐波那契数列 。该数列由 0 和 1 开始&#xff0c;后面的每一项数字都是前面两项…