前端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)}})
}

后端返回设置:

在这里插入图片描述

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

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

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

相关文章

【大数据】HBase入门指南

原创不易,注重版权。转载请注明原作者和原文链接 文章目录 HBase特性Hadoop的限制基本概念NameSpaceTableRowKeyColumnTimeStampCell 存储结构HBase 数据访问形式架构体系HBase组件HBase读写流程读流程写流程 MemStore Flush参数说明 StoreFile Compaction参数说明触…

ros学习笔记(1)Mac本地安装虚拟机,安装Ros2环境

Ros与Linux的关系 Ros环境基于Linux系统内核 我们平时用的是Linux发行版,centos,ubuntu等等,机器人就用了ubunut 有时候我们经常会听到ubunue的版本,众多版本中,有一些是长期维护版TLS,有一些是短期维护…

微信小程序 js中写一个px单位转rpx单位的函数

大家写东西自然还是会比较喜欢用rpx 但是 事实证明 在js中 还是px好用 因为很多单位交互的函数还是只返回px单位的 理论上将 750 rpx 是整个屏幕的宽度 那么 我们可以这样写一个函数 pxToRpx(px) {//获取整个屏幕的宽度单位 pxlet screenWidth wx.getSystemInfoSync().scree…

IDEA—java: 常量字符串过长问题解决

问题描述: Error: java: 常量字符串过长 问题分析: 字符串长度过长,导致 idea 默认使用的 javac 编译器编译不了。 解决办法: Javac 编译器改为 Eclipse 编译器。 File -> Settings -> Build,Execution,Deployment -&…

SQL中for xml path 的用法

1. 用法 是一种将查询结果转换为 XML 格式的方法。它可以将查询结果中的每一行转换为一个 XML 元素,并且可以指定元素的名称和属性。 2. 应用示例 有一张学生选修课程的表,如下图所示 希望整合成下图所示效果 --建表 if object_id(StudentInfo,u) is…

【22】c++设计模式——>外观模式

外观模式定义 为复杂系统提供一个简化接口&#xff0c;它通过创建一个高层接口(外观)&#xff0c;将多个子系统的复杂操作封装起来&#xff0c;以便客户端更容易使用。 简单实现 #include<iostream>// 子系统类 class SubsystemA { public:void operationA() {std::co…

【angular】实现简单的angular国际化(i18n)

文章目录 目标过程运行在TS中国际化参考 目标 实现简单的angular国际化。本博客实现中文版和法语版。 将Hello i18n!变为中文版&#xff1a;你好 i18n!或法语版:Bonjour l’i18n !。 过程 创建一个项目&#xff1a; ng new i18nDemo在集成终端中打开。 添加本地化包&#…

Python批量测试IP端口GUI程序(Tkinter)

一、实现样式 批量IP与端口中间用“,”分割&#xff0c;点击Telnet进行测试&#xff0c;前提是你电脑安装了telnet客户端&#xff0c;Clear按钮用来清空文本框。 二、核心点 1、使用Tkinter来制作桌面GUI页面 2、使用telnetlib模块测试telnet端口 三、困难点 1、测试结果…

这8款浏览器兼容性测试工具,用了以后测试效率可以“起飞”~~

浏览器的兼容性问题&#xff0c;是指不同浏览器使用内核及所支持的 HTML 等网页语言标准不同&#xff0c;用户客户端的环境不同造成的显示效果不能达到理想效果。 对于用户而言&#xff0c;无论使用哪款浏览器&#xff0c;期望看到的效果是正常的统一的。 市面上发布的浏览器…

[Spring] SpringMVC 简介(二)

目录 五、域对象共享数据 1、使用 ServletAPI 向 request 域对象共享数据 2、使用 ModelAndView 向 request 域对象共享数据 3、使用 Model、Map、ModelMap 向 request 域对象共享数据 4、向 session 域和 application 域共享数据 六、SpringMVC 的视图 1、ThymeleafVie…

云原生网关可观测性综合实践

作者&#xff1a;钰诚 可观测性 可观测性&#xff08;Observability&#xff09;是指系统、应用程序或服务的运行状态、性能和行为能够被有效地监测、理解和调试的能力。 随着系统架构从单体架构到集群架构再到微服务架构的演进&#xff0c;业务越来越庞大&#xff0c;也越来…

pytorch_神经网络构建3

文章目录 卷积神经网络实现卷积层,池化层池化层:数据标准化AlexNet卷积网络深层网络结构vgggoogleNet网络结构ResNet网络结构DensNet网络结构训练卷积神经网络会遇到的一些问题学习率衰减 卷积神经网络 前面讲述了逻辑回归分类,模拟函数回归问题,单层,深层网络,它们以点和向量…