从后端获取文件数据并导出

news2024/9/19 22:53:06

导出文件的公共方法

export const download = (res, tools) => {
  const { message, hide } = tools;
  const fileReader: any = new FileReader();
  console.log('fileReader-res>>>', res);
  fileReader.onload = (e) => {
    if (res?.data?.type === 'application/json') {
      try {
        const jsonData = JSON.parse(fileReader.result);
        if (jsonData?.success === false && jsonData?.message) {
          hide?.();
          message.error(jsonData?.message);
        }
      } catch (error) {
        hide?.();
        message.error(getLocalTextFun('common.export.error'));
      }
    } else {
      try {
        const filename = (
          res.response.headers.get('content-disposition').split('filename=')?.[1] || ''
        ).replace(/"/g, '');
        if ('msSaveOrOpenBlob' in navigator) {
          window.navigator.msSaveOrOpenBlob(res.data, decodeURI(filename));
        } else {
          const blob = new Blob([res.data]);
          const url = window.URL.createObjectURL(blob);
          const link: any = document.createElement('a');
          link.href = url;
          link.download = decodeURI(filename);
          link.click();
          hide?.();
          window.URL.revokeObjectURL(url);
        }
      } catch (err: any) {
        hide?.();
        message.error(getLocalTextFun('common.export.error'));
      }
    }
  };
  try {
    fileReader.readAsText(res.data);
  } catch (e) {
    hide?.();
    message.error(getLocalTextFun('common.export.error'));
  }
};

请求后端接口

const hide = message.loading(`加载中...`, 0);
const res = await exportI18nByLocal(record.locale);
download(res, {message, hide});

接口请求

export async function executeAndTryCatch(func: any) {
  try {
    return await func();
  } catch (error: any) {
    return error;
  }
}
export function exportI18nByLocal(locale:string) {
  return executeAndTryCatch(() =>
    request<Record<string, any>>(`${api().i18nExport}?locale=${locale}`, {
      method: 'GET',
      responseType: 'blob',
      //'Accept': 'application/vnd.ms-excel', 导出文件是excel
      headers: {
        'Accept': 'application/vnd.ms-excel',
        "locale": locale
      },
      //  获取返回数据结构里面包含response数据 如下图
      getResponse: true,
    }).then((res: any) => judgeErrorByResponseType(res)),
  );
}

接口返回结果
在这里插入图片描述

判断文件是否导出失败

function judgeErrorByResponseType(response: any) {
  const res = response.response;
  return new Promise((resolve, reject) => {
    if (!res) resolve('');
    if (res.headers.get('Content-Type').includes('json')) {
      const reader = new FileReader();
      reader.onload = () => {
        const { result }: any = reader;
        const errorInfos = JSON.parse(result);
        resolve(errorInfos);
      };
      reader.onerror = (err) => {
        reject(err);
      };
      reader.readAsText(response.data);
    } else {
      resolve(response);
    }
  });
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

WM8978 —— 带扬声器驱动程序的立体声编解码器(4)

接前一篇文章&#xff1a;WM8978 —— 带扬声器驱动程序的立体声编解码器&#xff08;3&#xff09; 九、寄存器概览与详解 1. 整体概览 WM8978芯片共有58个寄存器&#xff0c;整体总表如下&#xff1a; 2. 详细说明 在此&#xff0c;只介绍WM8978较为常用的那些寄存器。 &…

嵌入式典型总线及协议

在嵌入式系统中&#xff0c;各种总线和通信协议扮演着关键的角色&#xff0c;它们连接和协调系统中的各种硬件组件&#xff0c;实现数据传输和控制。本文将介绍一些典型的嵌入式总线及其通信协议&#xff0c;以及它们在嵌入式系统中的应用。 以下是我整理的关于嵌入式开发的一…

Java-SSM电影购票系统

Java-SSM电影购票系统 1.服务承诺&#xff1a; 包安装运行&#xff0c;如有需要欢迎联系&#xff08;VX:yuanchengruanjian&#xff09;。 2.项目所用框架: 前端:JSP、layui、bootstrap等。 后端:SSM,即Spring、SpringMvc、Mybatis等。 3.项目功能点: 3-1.后端功能: 1.用户管…

深入理解:蓝绿部署与金丝雀部署

深入理解&#xff1a;蓝绿部署与金丝雀部署 深入理解&#xff1a;蓝绿部署与金丝雀部署蓝绿部署&#xff08;Blue-Green Deployment&#xff09;原理优缺点适用场景 金丝雀部署&#xff08;Canary Deployment&#xff09;原理优缺点适用场景 总结 深入理解&#xff1a;蓝绿部署…

机器学习——决策树特征选择准则

机器学习——决策树特征选择准则 决策树是一种强大的机器学习模型&#xff0c;它可以用于分类和回归任务。决策树通过树状结构对数据进行分类&#xff0c;每个内部节点表示一个特征&#xff0c;每个叶节点表示一个类别或一个数值。在决策树构建的过程中&#xff0c;特征的选择…

Avalonia(11.0.2)+.NET6 打包运行到银河麒麟V10桌面系统

操作系统配置 项目结构 .net版本 这次我们是在银河麒麟V10系统上打包运行Avalonia(11.0.2)+.NET6.0的程序 开始打包 准备Linux下的桌面快捷方式以及图标 调整AvaloniaApplication2.Desktop.csproj的配置项,重点看下图红色线圈出来的部分,里面涉及到了LinuxPath的设置。完整的配…

【论文精读】OTA: Optimal Transport Assignment for Object Detection(物体探测的最优传输分配)

OTA最优传输 &#x1f680;&#x1f680;&#x1f680;摘要一、1️⃣ Introduction---介绍二、2️⃣Related Work---相关工作2.1 &#x1f393; Fixed Label Assignment--静态标签分配2.2 ✨Dynamic Label Assignment--动态标签分配 三、3️⃣Method---论文方法3.1 &#x1f39…

深度学习基础知识概述

深度学习理论 神经网络基础&#xff1a;感知机、前向传播、反向传播、激活函数 神经网络是深度学习的基础&#xff0c;它受到人脑结构的启发而设计。神经网络由许多相互连接的单元或节点组成&#xff0c;这些单元模拟生物神经元的功能。下面&#xff0c;我们将详细讲解神经网…

个人网站制作 Part 14 添加网站分析工具 | Web开发项目

文章目录 &#x1f469;‍&#x1f4bb; 基础Web开发练手项目系列&#xff1a;个人网站制作&#x1f680; 添加网站分析工具&#x1f528;使用Google Analytics&#x1f527;步骤 1: 注册Google Analytics账户&#x1f527;步骤 2: 获取跟踪代码 &#x1f528;使用Vue.js&#…

java.lang.String final

关于String不可变的问题&#xff1a;从毕业面试到现在&#xff0c;一个群里讨论的东西&#xff0c;反正码农面试啥都有&#xff0c;这也是我不咋喜欢面试代码&#xff0c;因为对于我而言&#xff0c;我并不喜欢这些面试。知道或不知道基本没啥含氧量&#xff0c;就是看看源代码…

【java】10.面向对象

一、类和对象 1.1 类和对象的理解 客观存在的事物皆为对象 &#xff0c;所以我们也常常说万物皆对象。 * 类 * 类的理解 * 类是对现实生活中一类具有共同属性和行为的事物的抽象 * 类是对象的数据类型&#xff0c;类是具有相同属性和行为的一组对象的集合 * 简单理解&am…

PHP连接达梦数据库

PDO是一种在PHP中连接数据库的接口&#xff0c;可以通过PDO接口使用PHP连接达梦数据库。 1、安装PHP环境 检查当前环境是否安装PHP [rootlocalhost ~]# php -v 当前环境并未安装PHP&#xff0c;需要进行安装&#xff0c;选择安装PHP7.3版本。 2、安装 epel-release源和源管…

2024.03.21作业

自由发挥实现一个登录窗口的应用场景 widget.h #ifndef WIDGET_H #define WIDGET_H#include <QPen> #include <QBrush> #include <QPainter> #include <QWidget>QT_BEGIN_NAMESPACE namespace Ui { class Widget; class Painter; } QT_END_NAMESPACE…

C语言:自定义类型:结构体

目录 1. 前言 2. 结构体初识 3. 结构体创建变量 3.1 方法一 3.2 方法二 4. 结构体初始化 5. 结构体自引用 6. 结构体的大小 6.1 结构体对齐规则 6.2 常规结构体 6.3 结构体成员含数组 6.4 结构体嵌套结构体 6.5 为什么存在结构体对齐&#xff1f; 6.6 修改默认对…

软考高级:软件架构评估-质量属性:可用性概念和例题

作者&#xff1a;明明如月学长&#xff0c; CSDN 博客专家&#xff0c;大厂高级 Java 工程师&#xff0c;《性能优化方法论》作者、《解锁大厂思维&#xff1a;剖析《阿里巴巴Java开发手册》》、《再学经典&#xff1a;《Effective Java》独家解析》专栏作者。 热门文章推荐&am…

Golang Gorm 自动分批查询

场景&#xff1a; 目标查询全量数据&#xff0c;但需要每次Limit分批查询&#xff0c;保护数据库 文档&#xff1a; https://gorm.io/zh_CN/docs/advanced_query.html // Param: // dest 目标地址 // batchSize 大小 // fc 处理函数func (db *DB) FindInBatc…

leetcode 18.四数之和 java

题目 思路 整体在三数之和的基础上进行修改。&#xff08;所有需要修改的地方&#xff0c;我在代码里加了//改 的注释&#xff09; 大的一个思路就是&#xff0c;在三数之和的外面再套一层循环。相当于固定前两个数。然后这道题目标值变成一个参数了&#xff0c;不是三数之和…

上位机图像处理和嵌入式模块部署(qmacvisual轮廓查找)

【 声明&#xff1a;版权所有&#xff0c;欢迎转载&#xff0c;请勿用于商业用途。 联系信箱&#xff1a;feixiaoxing 163.com】 前面我们说过&#xff0c;图像的处理流程一般都是这样的&#xff0c;即灰度化-》降噪-》边缘检测-》二值化-》开闭运算-》轮廓检测。虽然前面的几个…

Springboot 整合 Knife4j (API文档生成工具)

目录 一、Knife4j 介绍 二、Springboot 整合 Knife4j 1、pom.xml中引入依赖包 2、在application.yml 中添加 Knife4j 相关配置 3、打开 Knife4j UI界面 三、关于Knife4j框架中常用的注解 1、Api 2、ApiOperation ​3、ApiOperationSupport(order X) ​4、ApiImplici…

模态框被div class=modal-backdrop fade in覆盖的问题

模态框被<div class"modal-backdrop fade in">覆盖的问题 起因&#xff1a;在导入模态框时页面被一层灰色的标签覆盖住 F12查看后发现是一个<div class"modal-backdrop fade in"> 一开始以为是z-index的问题&#xff0c;但经过挨个修改后感觉…