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( ...
随机推荐
- 使用CSS里的user-select属性控制用户在页面上选中的内容
CSS里的user-select属性用来禁止用户用鼠标在页面上选中文字.图片等,也就是,让页面内容不可选.也可以只允许用户选中文字,或者全部都放开,用户可以同时选中文字.还包括文本里的图片.视频等其它 ...
- 【不做标题党,只做纯干货】HashMap在jdk1.7和1.8中的实现
同步首发:http://www.yuanrengu.com/index.php/20181106.html Java集合类的源码是深入学习Java非常好的素材,源码里很多优雅的写法和思路,会让人叹为 ...
- 运行VsCode缺少libxss.so.1
安装libXScrnSaver即可 yum install libXScrnSaver 使用的时候出现一个错误 bash: /usr/local/bin/rar: /lib/ld-linux. ...
- Cygwin配置总结
Cygwin配置总结 Cygwin是 大量GNU和开放源码工具的集合,它们提供了类似于Windows上的Linux发行版的功能 DLL(cygwin1.dll),它提供了大量的POSIX API功能. ...
- C# CancellationTokenSource和CancellationToken的实现
微软关于CancellationTokenSource的介绍很简单,其实CancellationTokenSource的使用也很简单,但是实现就不是那么简单了,我们首先来看看CancellationT ...
- securecrt8.1破解版安装与注册机的使用方法
转自:https://blog.csdn.net/sun897827804/article/details/78532157?locationNum=9&fps=1 SecureCRT是一款用 ...
- Effective Java 第三版——71. 避免不必要地使用检查异常
Tips 书中的源代码地址:https://github.com/jbloch/effective-java-3e-source-code 注意,书中的有些代码里方法是基于Java 9 API中的,所 ...
- chrome浏览器解决跨域问题
windows: 右击chrome图标 选择属性 快捷方式 在目标末尾位置,空格,输入--args --disable-web-security --user-data-dir 例如:"C: ...
- There is a chart instance already initialized on the dom!警告
使用Echarts插件的时候,多次加载会出现There is a chart instance already initialized on the dom.这个错误,改插件已经加载完成. 并且如果你 ...
- create-react-app入门教程
Create React App是FaceBook的React团队官方出的一个构建React单页面应用的脚手架工具.它本身集成了Webpack,并配置了一系列内置的loader和默认的npm的脚本,可 ...