AbortSignal

用法解释

AbortSignal 接口表示一个信号对象（ signal object ），它允许您通过 AbortController 对象与 DOM 请求（如 Fetch）进行通信并在需要时将其中止。

属性

AbortSignal 接口还继承了其父接口EventTarget的属性。

AbortSignal.aborted 只读

以 Boolean (en-US) 表示与之通信的请求是否被终止（true）或未终止（false）。

事件处理

AbortSignal.onabort

当 abort 事件触发时，即当信号正在与之通信的 DOM 请求被中止时调用。

方法

AbortSignal 接口从其父接口 EventTarget 继承方法。

用例

在以下片段中，我们旨在使用 Fetch API 下载视频。

我们首先使用AbortController()构造函数创建一个控制器，然后使用AbortController.signal (en-US)属性。

当获取请求被启动时，我们在请求的选项对象中传递 AbortSignal 作为一个选项（见下面的{signal}）。这将信号和控制器与获取请求相关联，并允许我们通过调用AbortController.abort()来中止它，如下面的第二个事件监听器所示。

var controller = new AbortController();
var signal = controller.signal;var downloadBtn = document.querySelector('.download');
var abortBtn = document.querySelector('.abort');downloadBtn.addEventListener('click', fetchVideo);abortBtn.addEventListener('click', function() {controller.abort();console.log('Download aborted');
});function fetchVideo() {...fetch(url, {signal}).then(function(response) {...}).catch(function(e) {reports.textContent = 'Download error: ' + e.message;})
}

AbortSignal相关推荐

如何在客户端终止一个已经发出的HTTP请求
Javascript 异步编程得益于 Promise 的实现,它们极大地提高了Web开发的性能和体验.不过原生的 Promise 有个最大的缺点就是一旦请求发出去,我们就无法取消它.但是我们找到了另一 ...
api代理提取_了解提取API
api代理提取 Interested in learning JavaScript? Get my ebook at jshandbook.com 有兴趣学习JavaScript吗? 在jshandb ...
PWA(Progressive Web App)入门系列：Fetch Request Headers Response Body
前言在 WEB 中,对于网络请求一直使用的是 XMLHttpRequest API 来处理,XMLHttpRequest 也很强大,传统的 Ajax 也是基于此 API 的.那么为什么 W3C 标准 ...
如何获取.then的返回值_仅仅知道如何终止XHR请求，或许对你来说是不够的！
TLDR: 当我们需要的时候,我们可以通过AbortController接口来终止一个或者多个请求. 前言到目前为止,我们有两个常用的基本的手段去发送请求进而局部刷新页面内容,其一是XMR(XMLH ...
http请求中必备的字符段_React Hooks中这样写HTTP请求可以避免内存泄漏
作者:蓝色的秋风转发链接:https://mp.weixin.qq.com/s/Sedap5_fszLuw3PMkvzFeQ 前言大家好 ! 今天,让我们看一下在 React Hooks 中使用 ...
AbortController 中止一个或多个Web请求
AbortController 接口表示一个控制器对象,允许你根据需要中止一个或多个 Web 请求. 你可以使用 AbortController.AbortController() 构造函数创建一个新 ...
禁止触摸屏触控板手指缩放，需要这样处理
目录禁止缩放触控板触摸屏 css 处理 js 处理扩展解读 touch-action touch-action 属性值 wheel 与 mousewheel passive options参数 ...
AbortController-中止请求
控制器+信号机动满足AbortController和AbortSignal: const controller = new AbortController(); const signal = con ...
触摸板触摸屏禁止手指缩放，这么处理才行
禁止缩放有天,辛苦做了个复杂操作功能的页面,上线后有用户反馈:很多功能使用不了.惊了,以为是哪里出了bug. 立马联系用户,才发现原来是用户使用笔记本电脑,没有禁用触控板,然后不小心碰到导致整个界面 ...

AbortSignal

用法解释

属性

事件处理

方法

用例

AbortSignal相关推荐

最新文章

热门文章