axios 中断请求
1
<button onclick="test()">click me</button>
<script src="https://unpkg.com/axios@0.18.0/dist/axios.js"></script>
<script>
const l = console.log;
async function test() {
const CancelToken = axios.CancelToken;
const source = CancelToken.source();
axios("http://localhost:5000/test", {
cancelToken: source.token,
})
.then(r => {
l(r.data);
})
.catch(err => {
if (axios.isCancel(err)) {
l(err.message);
} else {
console.error(err);
// handle error
}
});
source.cancel("abort。");
}
</script>
2
const CancelToken = axios.CancelToken;
let cancel;
axios("http://localhost:5000/test", {
cancelToken: new CancelToken(function executor(c) {
l(`请求结束前`);
cancel = c;
}),
})
.then(r => {
l(r.data);
})
.catch(err => {
if (axios.isCancel(err)) {
l(err.message);
} else {
console.error(err);
// handle error
}
});
cancel(`message`);
axios 中断请求的更多相关文章
- axios构建请求池处理全局loading状态&&axios避免重复请求
很多时候我们能够看到类似进度条一样的东西在页面顶部进行加载,代表页面是否加载完成,或者其他的loading效果,我们当然不可能通过promise.all来讲所有的请求合并到一起然后进行处理,这个时候我 ...
- Vue中断axios请求-切换页面+重复请求
切换页面时中断 一.概述 在Vue单页面开发过程中,遇到这样的情况,当我切换页面时,由于上一页面请求执行时间长,切换到该页面时,还未执行完,这时那个请求仍会继续执行直到请求结束,此时将会影响页面性能, ...
- Vue切换页面时中断axios请求
一.概述 在Vue单页面开发过程中,遇到这样的情况,当我切换页面时,由于上一页面请求执行时间长,切换到该页面时,还未执行完,这时那个请求仍会继续执行直到请求结束,此时将会影响页面性能,并且可能对现在页 ...
- Axios源码分析
Axios是一个基于promise的HTTP库,可以用在浏览器和node.js中. 文档地址:https://github.com/axios/axios axios理解和使用 1.请求配置 { // ...
- 异步请求与中断 ( XHR,Axios,Fetch对比 )
随着AJAX技术的诞生,前端正式进入了局部刷新和前后端分离的新时代,最初的服务请求技术是XHR,随着技术发展和ES6的诞生,jquery ajax,axios,fetch 等技术的产生让前端的异步请求 ...
- axos在async模式下如何中断请求
main.js import axios from 'axios' Vue.prototype.$http = axios Test.vue <template> <div clas ...
- 为什么axios请求接口会发起两次请求
之前在使用axios发现每次调用接口都会有两个请求,第一个请求时option请求,而且看不到请求参数,当时也没注意,只当做是做了一次预请求,判断接口是否通畅,但是最近发现并不是那么回事. 首先我们知道 ...
- axios基本用法
vue更新到2.0之后,作者就宣告不再对vue-resource更新,而是推荐的axios,前一段时间用了一下,现在说一下它的基本用法. 首先就是引入axios,如果你使用es6,只需要安装axios ...
- ASPNET MVC中断请求
ASPNET MVC如何正确的中断请求? 感觉是这样? 在aspnet开发过程中如果想要中断当前的http处理,以前在aspnet中一直是Response.End(); 在这Response.End( ...
随机推荐
- 初识 Nginx
Nginx 是一个免费的,开源的,高性能的HTTP服务器和反向代理,以及IMAP / POP3代理服务器. Nginx 以其高性能,稳定性,丰富的功能,简单的配置和低资源消耗而闻名.很多高知名度的网站 ...
- 弄懂JDK、JRE和JVM到底是什么 关系区别
首先是JDKJDK(Java Development Kit) 是 Java 语言的软件开发工具包(SDK).在JDK的安装目录下有一个jre目录,里面有两个文件夹bin和lib,在这里可以认为bin ...
- fashion datasets图像检索实践project
Using Siamese Networks and Pre-Trained Convolutional Neural Networks (CNNs) for Fashion Similarity M ...
- 先从一个 libev 的 demo 入手
最近想研究下 libev 这个网络库,所以先从官方文档一个最简单的 demo 开始,代码如下: //io.c // a single header file is required #include ...
- php获取客户端IP地址的方法
参考:https://www.cnblogs.com/rendd/p/6183094.html <?php function getip() { //strcasecmp 比较两个字符,不区分大 ...
- Windows 10 替换 cmd 的命令行工具
最近找 Windows 10 的命令行工具,发现了 Windows 自带的 PowerShell ,确实功能强大.推荐. 查找方法:搜索,PowserShell, 打开就能用. https://www ...
- Renascence架构介绍——文件夹
这一系列文章是为个人项目作一个介绍.有兴趣的朋友能够关注一下. https://github.com/jxt1234/Renascence 先写个文件夹.以后按文件夹更新 1.自己主动编程体系设想 2 ...
- 谈一谈iOS事件的产生和传递
谈一谈iOS事件的产生和传递 1.事件的产生 发生触摸事件后,系统会将该事件加入到一个由UIApplication管理的事件队列中. UIApplication会从事件队列中取出最前面的事件,并将事件 ...
- Source Insight小技巧:修改Symbol Window的默认宽度
SI是个好东西,但是源代码窗口左边的符号窗口的默认宽度实在是太小,每次打开一个新的源码窗口都要重新拖放调整,很烦人.下面是一劳永逸调整Symbol Window宽度的方法. 打开一个源码窗口,将Sym ...
- ssh连接服务器失败解决记录
故障:db2inst1用户无法通过ssh连接数据库服务器. 但是root用户可以连接,连接后su – db2inst1用户报错: su: cannot set user id: Resource te ...