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" & ...
随机推荐
- test-01-java 单元测试框架 junit 入门介绍
拓展阅读 junit5 系列 基于 junit5 实现 junitperf 源码分析 Auto generate mock data for java test.(便于 Java 测试自动生成对象信息 ...
- Vuex中的核心方法
Vuex中的核心方法 Vuex是一个专为Vue.js应用程序开发的状态管理模式,其采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.每一个Vuex应用的核心就是 ...
- Java8接口中抽象方法和default和static方法的区别和使用
Java接口说明 传统的理解是接口只能是抽象方法.但是程序员们在使用中,发现很不方便,实现接口必须重写所有方法,很麻烦.所以java设计者妥协了,在java8中,支持default和static方法, ...
- zTree如何实现模糊查找实战
1.说明 最近在研究zTree树控件.过程中涉及到了实现模糊查找结点的功能,特此分享一下. 有关zTree的有关介绍和使用,请访问其官网:zTree -- jQuery 树插件 本文假设你已经比较熟悉 ...
- SpringBoot整合Swagger2实现接口文档
展示一下 访问方式一 访问地址:http://localhost:8080/swagger-ui.html#/ 首页 详情页 访问方式二 访问地址:http://localhost:8080/doc. ...
- Redis原理再学习01:数据结构-跳跃表skiplist
跳跃表skiplist 简介 你一定比较好奇Redis里面的 sorted set 是怎么实现的,底层到底是什么?它的排序功能就是用到了这个skiplist-跳跃表. 什么是跳跃表? 跳跃表可以看做是 ...
- 【Android逆向】破解看雪test3.apk方案二
方案二就是要hook那三个条件,不让追加字符串变成false v20 = "REAL"; clazz = _JNIEnv::FindClass(env, "android ...
- pikachu sql inject delete 注入
留言板输入几条信息 出现删除按钮,点他 通过burpsuite拦截请求,请求报文如下 GET /vul/sqli/sqli_del.php?id=57 HTTP/1.1 Host: 192.168.1 ...
- Linux后台进程启停脚本模板
目录 启动脚本 停止脚本 在Linux上启动程序后台运行时,往往需要输入一堆复杂的命令,为了能快速编写一个完善的启动脚本,整理一个通用的启停脚本模板如下. 脚本支持从任意位置执行,不存在路径问题,启动 ...
- 【Azure Logic App】使用Outlook.com发送邮件遇到429报错
问题描述 在Logic App中使用 Outlook.com组件发送邮件,遇见了outlook connection报429的错误 {"error":{"code&quo ...