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

前端axios下载导出文件工具封装

使用示例:

import { fileDownload } from '@/utils/fileDownload'fileDownload({ url: process.env.VUE_APP_BASE_URL + `/statistic/pageList/export`, method: 'post', data: data })

工具类:

import store from '../store/index'
import {getAccessToken
} from '@/utils'
import axios from 'axios'
const token = store.getters.token || getAccessToken()
// 单个文件下载
export const fileDownload = (obj) => {let axiosParams = {method: obj.method,url: process.env.VUE_APP_apipath + obj.url,responseType: 'blob',headers: {'Authorization': `Bearer ${token}`}}if (obj.method && 'POST' === obj.method.toUpperCase()) {axiosParams.data = obj.data ? obj.data : {}}if (obj.method && 'GET' === obj.method.toUpperCase()) {axiosParams.params = obj.params ? obj.params : {}}return axios(axiosParams).then(res => {if (res && res.data) {const url = window.URL.createObjectURL(new Blob([res.data], {type: 'application/octet-stream'}))if (obj.noLink) {return url}const link = document.createElement('a')link.style.display = 'none'link.href = urlif (res.headers['content-disposition']) {console.log(decodeURI(res.headers['content-disposition'].slice(res.headers['content-disposition'].indexOf('=') + 1,res.headers['content-disposition'].indexOf('.'))))link.download =decodeURI(res.headers['content-disposition'].slice(res.headers['content-disposition'].indexOf('=') + 1,res.headers['content-disposition'].indexOf('.'))) +res.headers['content-disposition'].slice(res.headers['content-disposition'].indexOf('.'))} else {if (obj.fileName) {link.download = obj.fileName}}document.body.appendChild(link)link.click()window.URL.revokeObjectURL(url)}})
}

后端返回设置:

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

相关文章:

前端axios下载导出文件工具封装

使用示例: import { fileDownload } from /utils/fileDownloadfileDownload({ url: process.env.VUE_APP_BASE_URL /statistic/pageList/export, method: post, data: data })工具类: import store from ../store/index import {getAccessToken } fro…...

Web应用防火墙的性能优化技术

Web应用防火墙(WAF)是企业网络安全的重要屏障,其性能直接影响到网络服务的质量和安全。本文详细探讨了WAF性能优化的几种技术,旨在为网络安全专业人员提供实用的参考。 规则优化 1.1 精简规则集 规则评估:定期评估规…...

华为HCIP题库h12-821题库新增30题

901、 (多选题)下面关于BGP中的公认属性的描述,正确的是 A、公认必属性是所有BGP路由器都识别,且必须存在于Updata消息中 B、BGP必须识别所有公认属性 C、公认属性分为公认必遵和可选过渡两种 D、公认任意属性是所有BGP造由器…...

智慧办公数据可视化大屏设计(数据可视化)、大数据、数据大屏、办公数据大屏、办公数据

本次分享的作品是用软件Axure8.0(兼容9和10)制作的智慧办公数据进行的可视化大屏设计,主要是针对办公的综合数据、工位数据、会议室数据、访客数据、能耗数据以及设备智控数据进行可视化数据分析。 1、综合分析:对办公室的整体数据、空气质量…...

echarts实现横轴刻度名倾斜展示,并且解决文字超出部分消失问题

需求背景: xAxis.axisLabel. interval如果不手动设值的话,默认就是‘auto’,会采用标签不重叠的策略间隔显示标签。当数据量特别大的时候,展示出来的刻度标签就会很少,导致用户体验不好。如下图所示: 如果…...

awk常用统计命令

统计列的某元素个数 # 统计第4列为0的个数 awk $4 0 { count } END { print count } your_file.txt awk $4 0 { print } your_file.txt # 第4列为0的行打印到屏幕 awk $4 0 your_file.txt...

Linux:【Kafka四】集群介绍与单机搭建

目录 环境简介 一、搭建kafka集群 1.1、复制出两个kafka的配置文件 1.2、修改配置文件中的如下属性 二、启动kafka集群 三、可校验kafka三个节点是否均启动成功 四、查看集群中主题的分区和副本 4.1、新建一个包含了分区和副本的主题 4.2、查看该主题的详细信息 五、…...

代码随想录算法训练营Day52|动态规划11

代码随想录算法训练营Day52|动态规划11 文章目录 代码随想录算法训练营Day52|动态规划11一、123.买卖股票的最佳时机III二、188.买卖股票的最佳时机IV 买卖股票 难 一、123.买卖股票的最佳时机III class Solution {public int maxProfit(int[] prices) {int[] dp new int[4]…...

Android渲染系列之原理概述篇

屏幕硬件 渲染离不开屏幕,Android中的屏幕碎片化比较严重,尺寸大小不一,材质也是屏幕重要的因素。 目前智能手机主流的屏幕可分为两大类即液晶显示器; LCD (Liquid Crystal Display) 液晶显示器OLED (Organic Light Emitting Diode&#xf…...

类图 UML从入门到放弃系列之二

1.劝退说明(开个玩笑) UML包含有许多小组件、修饰符以及其他小巧复杂的东西。UML的内容相当庞大,以至于你可以花大量的时间把自己修成一个UML语言律师,并能够完成所有律师能够完成的工作:编写出所有人都无法理解的文档。现在流行的敏捷开发倡…...

诊断用抗原抗体——博迈伦

抗原抗体诊断是一种常见的临床诊断方法,它通过检测人体内特定抗原或抗体的存在来确定某种疾病或感染的存在与否。这种诊断方法可以用于许多不同的疾病和感染的检测,如传染病、自身免疫病、肿瘤等。 抗原抗体诊断的原理是基于抗原与抗体之间的特异性反应。…...

156 - Ananagrams (UVA)

题目链接如下&#xff1a; Online Judge 我的代码如下&#xff1a; #include <iostream> #include <string> #include <vector> #include <map> #include <algorithm> // #define debugint main(){#ifdef debugfreopen("0.txt", &q…...

vue3入门

一. Vue3的优势 二. 使用create-vue搭建Vue3项目 2.1 认识create-vue create-vue是Vue官方新的脚手架工具&#xff0c;底层切换到了 vite &#xff08;下一代前端工具链&#xff09;&#xff0c;为开发提供极速响应 2.2 使用create-vue创建项目 前置条件 - 已安装16.0或更高版…...

上机实验二 设计单循环链表 西安石油大学数据结构

实验名称:设计单循环链表 (1&#xff09;实验目的:掌握线性表的链式存储结构;掌握单循环链表及其基本操作的实现。 (2&#xff09;主要内容:实现单循环链表的初始化、求数据元素个数、插入、删除、取数据元素等操作;用插入法建立带头结点的单循环链表;设计一个测试主函数验证…...

小谈设计模式(28)—解释器模式

小谈设计模式&#xff08;28&#xff09;—解释器模式 专栏介绍专栏地址专栏介绍 解释器模式角色分析抽象表达式&#xff08;Abstract Expression&#xff09;终结符表达式&#xff08;Terminal Expression&#xff09;非终结符表达式&#xff08;Non-terminal Expression&…...

Access denied for user ‘root‘@‘xxx‘ (using password: YES)

Access denied for user rootxxx (using password: YES) 这表示MySQL服务端拒绝来自xxx主机的root用户登录&#xff0c;尽管我检查了一下&#xff0c;root的用户名和密码都没错&#xff0c;还是拒绝。 解决方案&#xff1a; select user,host from mysql.user; 执行发现&am…...

对象与成员函数指针 function+bind

functionbind的理解 function模板类的构造函数&#xff0c;把对象与成员函数绑定&#xff0c;重载了&#xff08;&#xff09;&#xff0c;利用对象调用成员函数 bind模板函数&#xff0c;把对象与成员函数绑定&#xff0c;返回function对象&#xff0c;成员函数传参代码链接点…...

如何在 PyTorch 中冻结模型权重以进行迁移学习:分步教程

一、说明 迁移学习是一种机器学习技术&#xff0c;其中预先训练的模型适用于新的但类似的问题。迁移学习的关键步骤之一是能够冻结预训练模型的层&#xff0c;以便在训练期间仅更新网络的某些部分。当您想要保留预训练模型已经学习的特征时&#xff0c;冻结至关重要。在本教程中…...

代码随想录算法训练营第六十二、六十三天 | 单调栈 part 2 | 503.下一个更大元素II 、42. 接雨水、84.柱状图中最大的矩形

目录 503.下一个更大元素II思路代码 42. 接雨水思路一 双指针思路二 单调栈代码 84.柱状图中最大的矩形思路一 双指针思路二 单调栈代码 503.下一个更大元素II Leetcode 思路 将数组乘2来遍历即可&#xff0c;就是加长版的每日温度。 但是处理起来会有细节&#xff0c;如果…...

c#设计模式-行为型模式 之 迭代器模式

&#x1f680;简介 提供一个对象来顺序访问聚合对象中的一系列数据&#xff0c;而不暴露聚合对象的内部表示。 迭代器模式主要包含以下角色&#xff1a; 抽象聚合&#xff08;Aggregate&#xff09;角色&#xff1a;定义存储、添加、删除聚合元素以及创建迭代器对象的接口…...

盘古信息PCB行业解决方案:以全域场景重构,激活智造新未来

一、破局&#xff1a;PCB行业的时代之问 在数字经济蓬勃发展的浪潮中&#xff0c;PCB&#xff08;印制电路板&#xff09;作为 “电子产品之母”&#xff0c;其重要性愈发凸显。随着 5G、人工智能等新兴技术的加速渗透&#xff0c;PCB行业面临着前所未有的挑战与机遇。产品迭代…...

Spring Boot 实现流式响应(兼容 2.7.x)

在实际开发中&#xff0c;我们可能会遇到一些流式数据处理的场景&#xff0c;比如接收来自上游接口的 Server-Sent Events&#xff08;SSE&#xff09; 或 流式 JSON 内容&#xff0c;并将其原样中转给前端页面或客户端。这种情况下&#xff0c;传统的 RestTemplate 缓存机制会…...

python/java环境配置

环境变量放一起 python&#xff1a; 1.首先下载Python Python下载地址&#xff1a;Download Python | Python.org downloads ---windows -- 64 2.安装Python 下面两个&#xff0c;然后自定义&#xff0c;全选 可以把前4个选上 3.环境配置 1&#xff09;搜高级系统设置 2…...

使用van-uploader 的UI组件,结合vue2如何实现图片上传组件的封装

以下是基于 vant-ui&#xff08;适配 Vue2 版本 &#xff09;实现截图中照片上传预览、删除功能&#xff0c;并封装成可复用组件的完整代码&#xff0c;包含样式和逻辑实现&#xff0c;可直接在 Vue2 项目中使用&#xff1a; 1. 封装的图片上传组件 ImageUploader.vue <te…...

(转)什么是DockerCompose?它有什么作用?

一、什么是DockerCompose? DockerCompose可以基于Compose文件帮我们快速的部署分布式应用&#xff0c;而无需手动一个个创建和运行容器。 Compose文件是一个文本文件&#xff0c;通过指令定义集群中的每个容器如何运行。 DockerCompose就是把DockerFile转换成指令去运行。 …...

CVE-2020-17519源码分析与漏洞复现(Flink 任意文件读取)

漏洞概览 漏洞名称&#xff1a;Apache Flink REST API 任意文件读取漏洞CVE编号&#xff1a;CVE-2020-17519CVSS评分&#xff1a;7.5影响版本&#xff1a;Apache Flink 1.11.0、1.11.1、1.11.2修复版本&#xff1a;≥ 1.11.3 或 ≥ 1.12.0漏洞类型&#xff1a;路径遍历&#x…...

WEB3全栈开发——面试专业技能点P7前端与链上集成

一、Next.js技术栈 ✅ 概念介绍 Next.js 是一个基于 React 的 服务端渲染&#xff08;SSR&#xff09;与静态网站生成&#xff08;SSG&#xff09; 框架&#xff0c;由 Vercel 开发。它简化了构建生产级 React 应用的过程&#xff0c;并内置了很多特性&#xff1a; ✅ 文件系…...

怎么开发一个网络协议模块(C语言框架)之(六) ——通用对象池总结(核心)

+---------------------------+ | operEntryTbl[] | ← 操作对象池 (对象数组) +---------------------------+ | 0 | 1 | 2 | ... | N-1 | +---------------------------+↓ 初始化时全部加入 +------------------------+ +-------------------------+ | …...

STM32标准库-ADC数模转换器

文章目录 一、ADC1.1简介1. 2逐次逼近型ADC1.3ADC框图1.4ADC基本结构1.4.1 信号 “上车点”&#xff1a;输入模块&#xff08;GPIO、温度、V_REFINT&#xff09;1.4.2 信号 “调度站”&#xff1a;多路开关1.4.3 信号 “加工厂”&#xff1a;ADC 转换器&#xff08;规则组 注入…...

leetcode_69.x的平方根

题目如下 &#xff1a; 看到题 &#xff0c;我们最原始的想法就是暴力解决: for(long long i 0;i<INT_MAX;i){if(i*ix){return i;}else if((i*i>x)&&((i-1)*(i-1)<x)){return i-1;}}我们直接开始遍历&#xff0c;我们是整数的平方根&#xff0c;所以我们分两…...