gz、zip等压缩文件postman成功下载但是前端项目中下载解压失败

原因:

  • axios的配置错误和版本过低
  • 错误的前端代码尝试通过axios.post()下载文件,但未正确设置responseTypeContent-Type
  • 解决方案:更新axios版本并调整axios请求方式,确保responseType为'arraybuffer'
bash 复制代码
 const raw = JSON.stringify({
    //查询参数
  })

  axios({
    method: 'post',
    url: `请求链接`,
    data: raw,
    responseType: 'arraybuffer',	//1、注意:responseType arraybuffer
    headers: {
      'Content-Type': 'application/json; application/octet-stream', 	//2、注意Content-Type其他的
      Authorization:
        'Bearer xxxx'
    }
  }).then(function (data) {
    console.log(data)
    const blob = new Blob([data.data], { type: 'application/gzip' })	//'application/zip'
    const downloadUrl = window.URL.createObjectURL(blob)
    const link = document.createElement('a')
    link.href = downloadUrl
    link.setAttribute('download', 'file.gz') //file.zip
    document.body.appendChild(link)
    link.click()
    document.body.removeChild(link) //下载完成移除元素
    window.URL.revokeObjectURL(downloadUrl) //释放blob对象
  })
相关推荐
m0_738120721 小时前
应急响应——知攻善防Web-3靶机详细教程
服务器·前端·网络·安全·web安全·php
程序员爱钓鱼8 小时前
Node.js 编程实战:文件读写操作
前端·后端·node.js
PineappleCoder8 小时前
工程化必备!SVG 雪碧图的最佳实践:ID 引用 + 缓存友好,无需手动算坐标
前端·性能优化
JIngJaneIL9 小时前
基于springboot + vue古城景区管理系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot·后端
敲敲了个代码9 小时前
隐式类型转换:哈基米 == 猫 ? true :false
开发语言·前端·javascript·学习·面试·web
澄江静如练_9 小时前
列表渲染(v-for)
前端·javascript·vue.js
JustHappy9 小时前
「chrome extensions🛠️」我写了一个超级简单的浏览器插件Vue开发模板
前端·javascript·github
Loo国昌9 小时前
Vue 3 前端工程化:架构、核心原理与生产实践
前端·vue.js·架构
sg_knight9 小时前
拥抱未来:ECMAScript Modules (ESM) 深度解析
开发语言·前端·javascript·vue·ecmascript·web·esm