解决前端二进制流下载的文件(例如:excel)打不开的问题

news/2024/7/21 7:33:40 标签: 前端, excel

1. 现在后端请求数据后,返回了一个二进制的数据,我们要把它下载下来。

这是响应的数据:

2. 这是调用接口的地方:

    uploadOk(){
      if(this.files.length === 0){
        return this.$Message.warning("请选择上传文件!!!")
      }
      let formData = new FormData();
      formData.append("file", this.files[0]);  // 文件对象
      Api.uploadQuery(formData).then(response=>{
          // 文件的下载
            const blob = new Blob([response], {'content-type': "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",})
            saveAs(blob, "表格的名字.xlsx")
        })
      })
    },

 使用了file-saver插件:github地址

3. 这时如果直接下载的话,打开文件就会失败

4. 这时就必须要在调接口的时候做一下处理

  uploadQuery(data){
    return fetch({
      url: "/fast-finance-core-service/mm/insurance/pay/uploadQuery",
      method: "POST",
      headers: {
        "Content-Type": "multipart/form-data",
        dataType: "file"
      },
      responseType: 'arraybuffer',  // 这一行必须要加,不然文件就打不开
      data
    });
  }

responseType: 'arraybuffer', 这个必须要加!!!

5. 然后刷新,重新下载就可以了

效果:

 如果还没解决的话,建议看一下这篇文档 文章


http://www.niftyadmin.cn/n/5055616.html

相关文章

Linux 操作另一台服务器

服务器信任 在运维场景中,如果需要在一台服务器操作另一台服务器,就需要目标服务器(下面称为 B 服务器)信任当前服务器(下面称为 A 服务器)。 在 A 服务器生成证书。 ssh-keygen -t rsa一直回车结束。 会在…

大数据之Kafka

Kafka概述 传统定义:一个分布式的基于发布/订阅模式的消息队列,主要应用于大数据实时处理领域。 最新定义:一个开源的分布式事件流平台,被数千家公司用于高性能数据管道、流分析、数据集成和关键任务应用。最主要的功能是做数据的…

踩坑 | vue动态绑定img标签src属性的一系列报错

文章目录 踩坑 | vue项目运行后使用require()图片也不显示问题描述vue中动态设置img的src不生效问题的原因require is not defined 解决办法1:src属性直接传入地址解决办法2 踩坑 | vue项目运行后使用require()图片也不显示 问题描述 在网上查阅之后,发…

JUC系列(一二):线程基础、生产与消费模型、8锁问题

发现 学习狂神JUC系列少了开篇 特此补发 线程与进程 线程、进程、如何来解释 进程 : 一个程序 如 QQ.exe Music.exe 程序的集合 一个进程可以包含多个线程,至少包含一个线程 Java 默认是开启两个线程 main GC 线程: 开了一个进程 比如&…

Ubuntu 20.04部署Promethues

sudo lsb_release -r可以看到操作系统版本是20.04,sudo uname -r可以看到内核版本是5.5.19。 sudo wget -c https://github.com/prometheus/prometheus/releases/download/v2.37.1/prometheus-2.37.1.linux-amd64.tar.gz下载必要的组件。 tar -zxf prometheus-2.…

【Leetcode】150.逆波兰表达式求值

一、题目 1、题目描述 给你一个字符串数组 tokens ,表示一个根据 逆波兰表示法 表示的算术表达式。 请你计算该表达式。返回一个表示表达式值的整数。 注意: 有效的算符为 +、-、* 和 / 。每个操作数(运算对象)都可以是一个整数或者另一个表达式。两个整数之间的除法总…

Socks5代理、IP代理与其在爬虫开发中的应用

在当今数字化时代,网络安全和数据获取变得愈发重要。代理服务器作为一种关键的技术手段,为网络工程师和爬虫开发人员提供了有力的工具。本文将深入探讨Socks5代理、IP代理以及它们在网络安全和爬虫应用中的角色与意义。 1. 代理服务器简介 代理服务器是…

【数据结构】单链表的基本操作(节点建立、插入删除)

单链表的基本操作 链表的定义链表的创建(初始化) 不带头结点的链表带头结点的链表 链表的插入和删除 按位序插入 带头结点不带头结点 指定节点的后插操作指定元素的前插操作按位序删除 带头结点不带头结点 指定元素的删除操作 1. 单链表的基本操作 链…