当前位置: 首页 > news >正文

[javascript]取消异步请求

使用AbortController取消异步请求,比如xmlHttpRequest/fetch发起的请求。

const controller = new AbortController();
const signal = controller.signal;fetch('https://api.example.com/data', { signal }).then(response => response.json()).then(data => console.log(data)).catch(err => {if (err.name === 'AbortError') {console.log('请求被取消');} else {console.error('其他错误', err);}});// 3 秒后取消请求
setTimeout(() => {controller.abort();
}, 3000);

同时abortController不仅仅只是用来取消异步请求,它还可以用来取消addEventListener事件监听,再也不需要通过removeEventListener来取消监听了,省的每次还得保留回调函数引用来移除监听器,直接一步到位使用abort取消

const controller = new AbortController();
const signal = controller.signal;document.addEventListener('click', () => {console.log('点击了页面');
}, { signal });// 5 秒后自动移除监听器
setTimeout(() => {controller.abort();console.log('事件监听器已取消');
}, 5000);

取消定时任务或者其他异步逻辑等

async function doSomething(signal) {await new Promise((resolve, reject) => {const id = setTimeout(resolve, 5000);signal.addEventListener('abort', () => {clearTimeout(id);reject(new DOMException('Aborted', 'AbortError'));});});
}

AbortController MDN

http://www.xdnf.cn/news/361009.html

相关文章:

  • 26考研——中央处理器_指令执行过程(5)
  • qiankun微前端任意位置子应用
  • Kubernetes调度策略深度解析:NodeSelector与NodeAffinity的正确打开方式
  • 网络安全体系架构:核心框架与关键机制解析
  • kubernetes服务自动伸缩-HPA
  • C++ 访问者模式详解
  • Redis面试题
  • 力扣26——删除有序数组中的重复项
  • 【推荐笔记工具】思源笔记 - 隐私优先的个人知识管理系统,支持 Markdown 排版、块级引用和双向链接
  • Qt 的原理及使用(1)——qt的背景及安装
  • 在另一个省发布抖音作品,IP属地会随之变化吗?
  • 【数据结构】1. 时间/空间复杂度
  • 2025数维杯数学建模A题完整论文模型代码:空中芭蕾
  • SpringBoot统一功能处理
  • 13.原生测试框架Unittest解决用例组织问题 与测试套件的使用
  • H5 移动端适配最佳实践落地指南。
  • 影楼精修-牙齿美型修复算法解析
  • 数据类型:List
  • robotframe启动ride.py
  • C++ Dll创建与调用 查看dll函数 MFC 单对话框应用程序(EXE 工程)改为 DLL 工程
  • C#学习——继承、封装、多态
  • 安科瑞DJSF1352-RN直流电能表的技术特点与应用
  • ZYNQ笔记(十九):VDMA VGA 输出分辨率可调
  • 各类音频放大器电路原理简析
  • MSF 生成不同的木马 msfvenom 框架命令
  • html object标签介绍(用于嵌入外部资源通用标签)(已不推荐使用deprecated,建议使用img、video、audio标签)
  • Nx与Monorepo
  • 【软件测试】测试用例的概念与常见测试的模型
  • Django ORM: values() 和 annotate() 方法详解
  • 2025-05-09 提示学习概念