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

前端文件下载通用方法

zip文件和xlsx文件

import axios from 'axios'
import { getToken } from '@/utils/auth'const mimeMap = {xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',zip: 'application/zip'
}const baseUrl = process.env.VUE_APP_BASE_API
// zip下载
export function downLoadZip(str, filename) {var url = baseUrl + straxios({method: 'get',url: url,responseType: 'blob',headers: { 'Authorization': 'Bearer ' + getToken() }}).then(res => {resolveBlob(res, mimeMap.zip)})
}
// xlsx文件下载
export function downLoadXlsx(str, filename) {var url = baseUrl + straxios({method: 'get',url: url,responseType: 'blob',headers: { 'Authorization': 'Bearer ' + getToken() }}).then(res => {resolveBlob(res, mimeMap.xlsx)})
}/*** 解析blob响应内容并下载* @param {*} res blob响应内容* @param {String} mimeType MIME类型*/
export function resolveBlob(res, mimeType) {const aLink = document.createElement('a')var blob = new Blob([res.data], { type: mimeType })// //从response的headers中获取filename, 后端response.setHeader("Content-disposition", "attachment; filename=xxxx.docx") 设置的文件名;var patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')var contentDisposition = decodeURI(res.headers['content-disposition'])var result = patt.exec(contentDisposition)var fileName = result[1]fileName = fileName.replace(/\"/g, '')aLink.href = URL.createObjectURL(blob)aLink.setAttribute('download', fileName) // 设置下载文件名称document.body.appendChild(aLink)aLink.click()document.body.appendChild(aLink)
}

xml封装通用文件下载

// XML 下载方法
export function xmlDownload( url, method, name) {var xhr = new XMLHttpRequest();xhr.open(method, url, true);xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");xhr.setRequestHeader("Authorization", "Bearer " + getToken());xhr.send();xhr.responseType = "blob"; // 返回类型blobxhr.onload = function () {let a = document.createElement("a");let blob = new Blob([this.response], {// type: "text/csv;charset=GBK;",type: "application/x-zip;",});let objectUrl = URL.createObjectURL(blob);a.setAttribute("href", objectUrl);a.setAttribute("download", name || 'final_model.xlsx');a.click();}
}

axios封装通用文件下载

import axios from 'axios'
// 创建axios实例
const service = axios.create({// axios中请求配置有baseURL选项,表示请求URL公共部分baseURL: process.env.VUE_APP_BASE_API1,// 超时timeout: 60 * 1000
})// 通用下载方法
export function download(url, params, filename, method) {return service[method || "post"](url, params, {transformRequest: [(params) => {return tansParams(params)}],headers: {'Content-Type': 'application/x-www-form-urlencoded'},responseType: 'blob'}).then((data, header) => {const content = dataconst blob = new Blob([content])if ('download' in document.createElement('a')) {const elink = document.createElement('a')elink.download = filenameelink.style.display = 'none'elink.href = URL.createObjectURL(blob)document.body.appendChild(elink)elink.click()URL.revokeObjectURL(elink.href)document.body.removeChild(elink)} else {navigator.msSaveBlob(blob, filename)}}).catch((r) => {console.error(r)})
}

http://www.lryc.cn/news/127609.html

相关文章:

  • htmlCSS-----案例展示
  • Android进阶之路 - 去除EditText内边距
  • ModStartCMS v7.0.0 多语言开发优化,多个常用组件升级
  • 一百五十八、Kettle——Kettle各版本及其相关安装包分享(网盘链接,不需积分、不需验证码) 持续更新、持续分享
  • 【通俗易懂】如何使用GitHub上传文件,如何用git在github上传文件
  • 计算机视觉之三维重建(二)(摄像机标定)
  • PHP面向对象面试题
  • 6G 特点及表现
  • 【Git】(一)基本操作
  • Github下载任意版本的VsCode
  • ThreadLocal(超详细介绍!!)
  • stable diffusion安装包和超火使用文档,数字人制作网址
  • JVM——HotSpot的算法细节实现
  • 高等数学教材重难点题型总结(三)微分中值定理和导数的应用
  • 神经网络基础-神经网络补充概念-39-梯度消失与梯度爆炸
  • P12-Retentive NetWork-RetNet挑战Transformer
  • 数据库基础
  • 【RocketMQ】安装
  • 二十二、策略模式
  • [K8s]问题描述:k8s拉起来的容器少了cuda的so文件
  • Postman如何做接口测试:什么?postman 还可以做压力测试?
  • MySQL 自增 ID 默认从 1 开始,如何设置自增 ID 从 0 开始
  • WebRTC音视频通话-实现iOS端调用ossrs视频通话服务
  • uniapp的UI框架组件库——uView
  • 由于找不到msvcp140.dll无法继续执行代码是什么原因
  • kafka生产者幂等与事务
  • Docker容器:docker基础概述、安装、网络及资源控制
  • 实验篇——亚细胞定位
  • 【日常积累】HTTP和HTTPS的区别
  • Qt creator之对齐参考线——新增可视化缩进功能