axios中设置了response:blol后,如何处理json对象
axios中文件下载
上传文件后台校验,若失败则下载文件
let loading = this.$common.loading("正在上传");
let form = new FormData();
let headers = {
responseType: "blob"
};
form.append("file", e.file);
this.$axios
.post(e.action, form, headers)
.then(res => {
loading.close();
let _this = this;
let reader = new FileReader();
reader.readAsText(res, "utf-8");
reader.onload = function() {
try {
let a = JSON.parse(this.result);
let b = a.data.totel;
let c = b.split(",");
_this.$message.success(
`总共${c[0]}条, 成功${c[1]}条, 重复${c[2]}条(数据库中已存在))`
);
} catch (error) {
let blob = new Blob([res]);
let objectUrl = URL.createObjectURL(blob);
let a = document.createElement("a");
a.href = objectUrl;
a.download = "错误样本.xls";
//下面这个写法兼容火狐
a.dispatchEvent(
new MouseEvent("click", {
bubbles: true,
cancelable: true,
view: window
})
);
window.URL.revokeObjectURL(blob);
}
};
reponseType设为blob后如何校验是否正确与否
抽离上面的东东
后台处理逻辑为成功返回json,失败返回流提供下载
思路将blob转化为json,转换成功则上传成功,转换失败为流下载文件
let reader = new FileReader();
reader.readAsText(res, "utf-8");
reader.onload = function() {
try {
let a = JSON.parse(this.result);
let b = a.data.totel;
let c = b.split(",");
_this.$message.success(
`总共${c[0]}条, 成功${c[1]}条, 重复${c[2]}条(数据库中已存在))`
);
} catch (error) {
let blob = new Blob([res]);
let objectUrl = URL.createObjectURL(blob);
let a = document.createElement("a");
a.href = objectUrl;
a.download = "错误样本.xls";
//下面这个写法兼容火狐
a.dispatchEvent(
new MouseEvent("click", {
bubbles: true,
cancelable: true,
view: window
})
);
window.URL.revokeObjectURL(blob);
}
}
参考文章 https://www.cnblogs.com/qilj/p/11950517.html
axios中设置了response:blol后,如何处理json对象的更多相关文章
- 在ASP.NET MVC中使用Knockout实践01,绑定Json对象
本篇体验在ASP.NET MVC下使用Knockout,将使用EF Code First创建数据库.最后让Knockout绑定一个Json对象. 创建一个领域模型. namespace MvcAppl ...
- winform中设置FormBorderStyle为None后点击任务栏自动最小化实现
在winform编程中,有时候我们可能对窗体样式需要定义,不适用系统自带的样式,这样我们可以设置FormBorderStyle属性为None.但是设置了FormBorderStyle为None后,我们 ...
- Android RadioGroup中设置默认选中RadioButton 后,选中两个的问题 解决方法
项目中遇到多个RadioGroup中单选RadioButton ,设置了默认选中第一个 . 然后就 能选中两个RadioButton . . .. 我开始这样给设置默认选中一个的: for (int ...
- WPF中设置了WindowStyle="None"后,窗口仍然有边框的解决方法
1. 设置了窗体的WindowStyle="None",窗口还是右边框,如下图: 2. 这是因为窗体默认是可以改变大小的,所以需要修改ResizeMode的值 ResizeMode ...
- axios中设置Content-Type不生效的问题
Api:axios(config): config中无data字段时,headers里的Content-Type无效果,这应该出于优化的层面,此时的Content-Length=0,无需向服务端提供C ...
- ios中设置input为readonly后,解决弹起软键盘的问题
可以在input中添加unselectable="on" onfocus="this.blur()",可以解决软键盘弹起问题 <input type=&q ...
- axios中设置post请求,后台却无法识别参数
场景:在使用iview时,定义api请求时,代码如下 export const delWord = (data) => { return axios.request({ url: '/words ...
- C#中Object转化为json对象
比如定义一个类: public class Lines { public string X1 { get; set; } public string X2 { get; set; } public s ...
- Flask Response响应(flask中设置响应信息的方法,返回json数据的方法)
设置响应信息的方法 1. 返回自定义的响应头,有两种方式: (1) 第一种是:视图函数return的时候,使用元组,返回自定义的信息 返回的时候的状态码可以自定义信息:"状态码 自定 ...
- Html中设置访问页面不在后进行其他页面跳转
Html中设置访问页面不在后进行其他页面跳转 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" & ...
随机推荐
- less变量书写及样式混入
定义变量 定义混入样式 变量及混入样式使用 样式文件中 ~@代表src
- 非常好用的VS Code插件
Auto-Collapse Explorer 如果希望在VS Code编辑器中打开文件的时候自动展开对应的目录结构,需要开启"Auto Reveal". 具体设置步骤: 1.打开设 ...
- VS Code实现SSH远程开发
最近收获一台新台式机,但是个人主要还是使用自己的笔记本,用了几天远程控制,感觉各种不方便,最终决定配置一下VS Code实现SSH远程开发,特此记录. 首先介绍一下环境,控制端是Windows 11, ...
- 矩池云 | GPU 分布式使用教程之 Pytorch
GPU 分布式使用教程之 Pytorch Pytorch 官方推荐使用 DistributedDataParallel(DDP) 模块来实现单机多卡和多机多卡分布式计算.DDP 模块涉及了一些新概念, ...
- ECMA Script Module(ES module)知识点
1.每个 ES Module 都是运行在单独的私有作用,ESM 自动采用严格模式,忽略use strict <script type="module">console. ...
- 【Azure 存储服务】App Service 访问开启防火墙的存储账号时遇见 403 (This request is not authorized to perform this operation.)
问题描述 需要 App Service 访问开启防火墙的存储账号.存储账号中设置为允许选中的VNET访问,同时允许了信任的Azure服务的访问,但是仍然报错 "403 (This reque ...
- MVVM框架模式
MVC框架模式 MVP框架模式 MVVM框架模式 MVVM模式即: 1.Model:数据层.网络数据操作,file文件操作,本地数据库操作: 2.View:视图层.布局加载,ui交互. 3.ViewM ...
- spingboot打造教育平台(谷粒学院课程笔记)
第一单fqb 申明,项目的框架技术架构,前端运行时node 后端框架spring 开发前准备:mysbatis官网随时看文档,IDEa 202编释器2 环境配置,idea配置一下mavem路 ...
- Linux 系统进程管理
Linux 系统进程管理 目录 Linux 系统进程管理 一.进程的概述 1.1 什么是进程? 1.2 进程和程序的区别 1.3 进程的生命周期 1.4 进程的运行过程 二. 静态显示进程状态-ps ...
- Zabbix_get基础命令浅析
zabbix_get是Zabbix监控系统的一个命令行工具,可以用于从Zabbix服务器或代理获取数据.以下是zabbix_get的基本使用方法: 1.获取一个单独的键值对 使用以下命令可以获取一个单 ...